Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   добавить addEventListener, который бы срабатывал при измении содержания select (https://javascript.ru/forum/dom-window/59821-dobavit-addeventlistener-kotoryjj-srabatyval-pri-izmenii-soderzhaniya-select.html)

sovsem-nub 28.11.2015 18:25

добавить addEventListener, который бы срабатывал при измении содержания select
 
есть такой пример списка городов http://jsfiddle.net/4fbej3Lp/10/


<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
</head><body>

Введите город прибытия: 
<input type="text" name="opt"></input> <br>
<select id="arrivalPoint"></select>

<script>
var val="Москва";
var data = {q: val};


// This line taken from J50Npi.min.js (within this repo)
var J50Npi={currentScript:null,getJSON:function(b,d,h){var g=b+(b.indexOf("?")+1?"&":"?");var c=document.getElementsByTagName("head")[0];var a=document.createElement("script");var f=[];var e="";this.success=h;d.callback="J50Npi.success";for(e in d){f.push(e+"="+encodeURIComponent(d[e]))}g+=f.join("&");a.type="text/javascript";a.src=g;if(this.currentScript){c.removeChild(currentScript)}c.appendChild(a)},success:null};


var url = 'http://public.services.dellin.ru/autocomplete/?answerType=jsonp&callback=arrivalPointRender';

// We need a function callback to be executed after the response is received
var arrivalPointRender = function(data){
    var html = '', selected = false;
    for(var i = 0; i < data.length; i++){
           if (data[i].inPrice==1){
        html += '<option value="'+data[i].code+'"'+(selected?'':' selected')+'>'+data[i].label+" "+data[i].uString+'</option>'
        selected = false           }
    }
document.getElementById('arrivalPoint').innerHTML = html;



};

J50Npi.getJSON(url, data, arrivalPointRender);

		var      inp = document.querySelector('[name="opt"]');
        inp.addEventListener("input", function() {
val=this.value;
           data = {q: val};  
       
            J50Npi.getJSON(url, data, arrivalPointRender);
        })

        
    document.getElementById('arrivalPoint').addEventListener("change", function() {
alert("город поменялся");
        })      

</script>

</body>
</html>


нужно чтобы алерт появлялся, когда содержимое селекта меняется (а меняется он если менять input), а он появляется только если по нему мышкой кликнуть.

Malleys 28.11.2015 19:37

...а меняется он если менять input.

Значит тогда и нужно вставлять этот alert. В строке 39.

sovsem-nub 28.11.2015 19:55

Цитата:

Сообщение от Malleys (Сообщение 397943)
...а меняется он если менять input.

Значит тогда и нужно вставлять этот alert. В строке 39.

если бы было всё так просто....
если туда вставить alert он будет выскакивать на каждой букве в независимости поменялся select или нет. при изменении инпута селект меняется не всегда.

Malleys 28.11.2015 20:05

при изменении инпута селект меняется не всегда

.... тогда надо проверять изменился или нет...

http://jsfiddle.net/4fbej3Lp/11/


Часовой пояс GMT +3, время: 20:30.