使用Javascript在数组中存储键和值

Question

我有一个jsp页面上的表是动态的，有复选框在页面上，当你点击那个框应该保存在数组中，当它取消复选框，它应该从数组中删除值。

我已经尝试过创建一个方法，但它不是完美的工作，你可以帮助我…

function addCheckboxVAlues(checked){
    var split = checked.value.split("|");
    var key =split[0];
    var value=split[1];
    var chks = $("input[name='"+key+"']:checked");
      if (chks.length > 0)  {
         uninvoiced.push(value);
      } else {
         uninvoiced.pop(key);
      }
      console.log(uninvoiced);
}

Answer 1

您需要使用splice从数组中删除元素

function addCheckboxVAlues(checked){
    var split = checked.value.split("|");
    var key =split[0];
    var value=split[1];
    var chks = $("input[name='"+key+"']:checked");
    var index = uninvoiced.indexOf(key);
      if (chks.length > 0)  {
         uninvoiced.push(value);
      } else if(index > -1){
         uninvoiced.splice(index, 1);
      }
      console.log(uninvoiced);
}

Answer 2

这段代码看起来比实际需要的要复杂得多。假设复选框上有一个点击监听器，所以应该使用this复选框调用它。你所要做的就是在复选框被选中时添加值，如果复选框未被选中则删除值。

这将比每次运行一个checked选择器要高效得多。

为方便起见，下面使用了内联侦听器，就像您动态附加它们一样，但调用方式似乎相同。

var uninvoiced = [];
function addCheckbox(el) {
  var value = el.value.split('|')[1];
  if (el.checked) {
    uninvoiced.push(value);
  } else {
    uninvoiced.splice(uninvoiced.indexOf(value), 1);
  }
  console.log(uninvoiced);
}

foo|bar: <input type="checkbox" value="foo|bar" onclick="addCheckbox(this)">
fee|fum: <input type="checkbox" value="fee|fum" onclick="addCheckbox(this)">

在MDN上indexOf有一个填充。