Question

基本上，当尝试在jQuery中使用each函数时，我遇到了一个我似乎无法通过的问题，

这是我试图使用的jQuery代码：

$('#status_update').each(function(index) {
        alert(this);
        $(this).on('change', function (e) {
            alert('changed');
        });
});

以下是我正在使用的 HTML 代码：

<select name='status_update[]' class='input input-medium' id='status_update' data-id='1'>
    <option value='0' selected>Not Admitted</option>
    <option value='1'>Admitted</option>
</select>

<select name='status_update[]' class='input input-medium' id='status_update' data-id='1'>
    <option value='0' selected>Not Admitted</option>
    <option value='1'>Admitted</option>
</select>
<select name='status_update[]' class='input input-medium' id='status_update' data-id='1'>
    <option value='0' selected>Not Admitted</option>
    <option value='1'>Admitted</option>
</select>

etc....

它适用于第一个，但之后它不会激活jQuery中的on.change()，导致它不处理。

Answer 1

id should be unique in a document，您有多个具有相同ID的元素。

您可以对所有元素使用公共类，并使用类选择器而不是id选择器

$('.status_update').each(function(index) {
        alert(this);
        $(this).on('change', function (e) {
            alert('changed');
        });
});

Answer 2

ID只应应用于单个元素。尝试使用.input-medium作为你的jquery选择器，即：

$('.input-medium').each(function(index) {
    alert(this);
    $(this).on('change', function (e) {
        alert('changed');
    });
});

Answer 3

你不能为多个元素分配相同的id，所以最好删除id并使用class

Answer 4

如果动态生成元素，则有两种解决方法：

首先：使用jQuery live函数[已弃用]，改为使用jQuery

http://api.jquery.com/on/

第二：创建元素后，添加onchange。例如：

val jQel = $("<select name='status_update[]' class='input input-medium' data-id='1'>
    <option value='0' selected>Not Admitted</option>
    <option value='1'>Admitted</option>
</select>");
$(jQel).find(".input").change(function(){
 //add code here
});
//then your append code somewhere

Answer 5

试试这个

$('input[id="status_update"]').each(function(index) {
        alert(this);
        $(this).on('change', function (e) {
            alert('changed');
        });
});

.each只在第一个选择框上工作

5 个答案: