使用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來調用它 。 您所要做的就是如果選中此復選框，則添加該值；如果未選中此復選框，則將其刪除。

這將比每次運行一個選中的選擇器都高效得多。

為了方便起見，以下使用內聯偵聽器，就像您是在動態附加它們一樣，但它的調用方式似乎相同。

 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的polyfill 。