javascript - 从 jQuery 中的复选框的数组值中删除

Question

我有一个这样的复选框:

while($userRow=$resultForUsers->fetch_assoc()){
      $nameOfUser=$userRow['users_name'];
      $userId=$userRow['user_facebook_id'];
      $userFBPicture=$userRow['users_picture'];
      echo "
      <tr class='tr-data-users'>
      <td class='text-center'>
      <input type='checkbox' class='checkbox' onclick='if(this.checked){selo(this.value)}else{izbaci(this.value)}' value=$userId>
      </td>

因此，对于我数据库中的每个用户，我都有一个复选框，其中包含他的 ID 值。我需要一个数组中所有选中用户(即复选框)的 ID。我是这样做的:

<input type='checkbox' class='checkbox' onclick='if(this.checked){put(this.value)}else{remove(this.value)}' value=$userId>
 var  niz={};
    var index=0;
        function put(o){
            niz[index++]=o;
            console.log(niz);
        }

因此，console.log 现在显示所有选中复选框的 ID。我想要做的是，如果未选中复选框，则从数组中删除该 id(即 chechbox 值)。我这样试过:

onclick='if(this.checked){put(this.value)}else{remove(this.value)}'
 var  niz={};
    var index=0;
        function put(o){
            niz[index++]=o;
            console.log(niz);
            remove(o,niz);
        }

        function remove(o,niz){
            if($.inArray(o,niz)){
                console.log('radim');
                var indexNiza= $.inArray(o,niz);
               niz= $.grep(niz,function(a,o){
                   return (a!=o);
               });
            }
        }   

如您所见，此 else 部分应该处理未选中复选框的情况，并从数组中删除该 id，但它不起作用。真的很感激这方面的帮助。

Answer 1

看起来你写的代码是为了一个简单的工作而走的很复杂的路线。您可以查看以下示例，了解如何将 checked 和 unchecked 状态的所有值获取到它们自己的数组中。

在演示中，如果用户更改任何复选框的状态，我将枚举选中和未选中的复选框，并将选中的值存储在名为 cbChecked 的数组中，未选中的值存储在 cbUnchecked

这里的关键是使用的选择器:

选择器用法

获取所有“选中”的对象

:checked

获取所有“未检查”的对象

:not(:checked)

---

演示

$(document).ready(function() {
  
  $("input[type='checkbox']").change(function() {
    var cbChecked = new Array();
    var cbUnchecked = new Array();
    $("input[type='checkbox']:checked").each(function() {
      cbChecked[cbChecked.length] = this.value;            
    });
    
    $("input[type='checkbox']:not(:checked)").each(function() {
      cbUnchecked[cbUnchecked.length] = this.value;            
    });
    
    $("p#cbChecked").html( cbChecked.join() );
    $("p#cbUnchecked").html( cbUnchecked.join() );
  
  });
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<h2> The checkbox form</h2>
<form id="foo">
  <p>A : <input type="checkbox" id="a" value="a"></p>
  <p>B : <input type="checkbox" id="b" value="b"></p>
  <p>C : <input type="checkbox" id="c" value="c"></p>
  <p>D : <input type="checkbox" id="d" value="d"></p>
  <p>E : <input type="checkbox" id="e" value="e"></p>
  <p>F : <input type="checkbox" id="f" value="f"></p>
</form>

<h2>Checked Values</h2>
<p id="cbChecked"></p>

<h2>Unchecked Values</h2>
<p id="cbUnchecked"></p>