通过选中和取消选中复选框来添加和删除数组中的值

Adding and removing values from array by checking and unchecking checkboxes

本文关键字:删除 数组 添加 复选框 取消      更新时间:2023-09-26

以下代码在选中复选框时将复选框值添加到数组中。如何更改此设置,以便在取消选中复选框时从数组中删除复选框的值?

var departments = [];
$("input[name='department_pk[]']").change(function() {
        $("input[name='department_pk[]']:checked").each(function(i){
          departments[i] = $(this).val();
        }); 
}); 

问题是您没有从数组中删除以前选择的项。假设您现在已经在数组中选择了5个项目,您有索引0到4的数据,那么您现在取消选择2个项目。您的每个循环都将重置索引0到2,但索引3和4仍然存在于数组中。这就是问题所在。

一个更好的解决方案是使用.map()创建一个新的数组

var departments = [];
$("input[name='department_pk[]']").change(function () {
    departments = $("input[name='department_pk[]']:checked").map(function (i) {
        return $(this).val();
    }).get();
});

在添加新元素之前,我会先清除数组。

var departments = [];
$("input[name='department_pk[]']").change(function() {
    departments = [];
    $("input[name='department_pk[]']:checked").each(function(i){
      departments[i] = $(this).val();
    }); 
}); 
check this..
var departments = [];
    $("input[name='department_pk[]']").change(function() {
            $("input[name='department_pk[]']").each(function(i){
              if(jQuery(this).is(":checked")) {
                 departments[i] = $(this).val();
               } else {
                  departments[i] = 0;
               }
            }); 
    });

这类方法有效,但map()更准确:

          if($(this).is(':checked')) {
    departments.push($(this).val());
  } else {
    departments.pop($(this).val());
  }