Jquery 选择重新填充时触发更改事件

Jquery 选择重新填充时触发更改事件,jquery,Jquery,我有一个输入,在更改时填充select中的选项条目。当选择第一个选项,然后重新填充select,并再次自动选择第一个选项时,我希望触发更改事件,因为选择了具有不同值的选项 用jQuery解决这个问题的一个简单方法是什么 <select id="s"> <option value="1">1</option> </select> <input type="button" id="r" value="remove"> <inp

我有一个输入,在更改时填充select中的选项条目。当选择第一个选项,然后重新填充select,并再次自动选择第一个选项时,我希望触发更改事件,因为选择了具有不同值的选项

用jQuery解决这个问题的一个简单方法是什么

<select id="s">
    <option value="1">1</option>
</select>
<input type="button" id="r" value="remove">
<input type="button" id="a" value="add">

<script>
$(document).ready(function () {
    var s = $("#s");
    var i = 100;

    s.change(function () {
        alert("changed");
    });

    $("#r").click(function () {
        s.find("option").remove();
    });

    $("#a").click(function () {
        s.append($("<option>", {
            value: ++i
        }).text(i));
        });


    // Select has changed from 1 to 101, 
    // so I want an event to be triggered
    $("#r").click();
    $("#a").click();

    // but I do not want it to be triggered 
    // when same value is selected
    $("#r").click();
    s.append($("<option>", { value: i }).text(i));
    });
</script>

这里创建了一个

虽然不是最微妙的解决方案,但添加了ifs.children.length==1s.change;添加按钮功能将起作用:

这方面的例子


作为第二个旁注,add和remove可以组合成一个单独的函数,其中有一个参数声明add或remove,用于检查前后的值。

虽然不是最微妙的解决方案,但添加ifs.children.length==1s.change;添加按钮功能将起作用:

这方面的例子

作为第二个旁注,add和remove可以组合成一个单独的函数,其中一个参数表示add或remove,用于检查前后的值

$("#a").click(function () {        
    s.append($("<option>", {
        value: ++i
    }).text(i));
    if(s.children().length===1)s.change();
});
$("#r").click(function () {
    var sel = s.val();        
    s.children("option:last").remove(); //remove last option (use option:first to remove the first)
    var newval = s.val();
    if(sel !== newval && newval)s.change(); //fire change if the removed item was the selected one, but not if not items are left.
});