Question

在下面的示例代码中。当我点击第一个复选框时，我收到警报，但是对于第二个复选框，我没有收到警报。我相信，这可能是因为id是相同的。有人可以说明如何过来这个。我希望有一种方法可以将所有复选框值保存在列表中，并在取消选中时删除。

$(function(){
    $('#abc').click(updateList);
});

function updateList() {
    var allVals = [];
    $('#abc').each(function() {
         allVals.push($(this).val());
    });
    alert(allVals);
}

<table>
<tr>
    <td>
        <input type="checkbox" value="1" id="abc" /> 1
    </td>
</tr>
<tr>
    <td>
         <input type="checkbox" value="2" id="abc" /> 2
    </td>
</tr>
</table>

Not working JSFiddle sample code

Answer 1

元素的ID必须是唯一的，使用class对相似的元素进行分组

<input type="checkbox" value="1" class="abc" /> 1

然后

$(function(){
    $('.abc').change(updateList);
});

function updateList() {
    var allVals = $('.abc').map(function() {
        return this.value
    }).get();
    alert(allVals);
}

演示：Fiddle

如果您只想选中已选中的复选框

$(function(){
    $('.abc').change(updateList);
});

function updateList() {
    var allVals = $('.abc:checked').map(function() {
        return this.value
    }).get();
    alert(allVals);
}

演示：Fiddle

收集所有复选框的值

1 个答案: