使用输入复选框时获取数组中的值时出错

Question

我有一个示例：

<input type="checkbox" id="in-category-1" name="post_category[]" value="1">
<input type="checkbox" id="in-category-2" name="post_category[]" value="2">
<input type="checkbox" id="in-category-3" name="post_category[]" value="3">
<input type="checkbox" id="in-category-4" name="post_category[]" value="4">
<input type="checkbox" id="in-category-5" name="post_category[]" value="5">

和jquery：

var selectednumbers = [];
jQuery('input[type=checkbox]').each(function(i, selected) {
   selectednumbers[i] = jQuery(selected).val();
});
alert(selectednumbers);

=> 错误在选中和取消选中时无法获取值

Answer 1

您可以使用 change（） 事件获取所选值以及 map（） 方法来检索数组：

jQuery('input[type=checkbox]').on("change", function () {
    var selectednumbers = jQuery('input[type=checkbox]:checked').map(function () {
        return this.value;
    }).get();
    alert(selectednumbers);
});

小提琴演示

Answer 2

如果要在数组中包含选定的项目值，请使用 .map（）

var selectednumbers = jQuery('input[type=checkbox]:checked').map(function (i, selected) {
    return this.value;
}).get();
alert(selectednumbers);

Answer 3

若要获取选中状态，不能使用val()改用 .checked 属性：

selectednumbers[i] = selected.checked;

Answer 4

将更改事件绑定到复选框

jQuery('input[type=checkbox]').on("change",function(){
    var selectednumbers = [];
    jQuery('input[type=checkbox]').each(function(i, selected) {
        selectednumbers[i] = selected.value + ' : ' + selected.checked;
    });
    alert(selectednumbers);
})

小提琴演示