jquery - 如果不存在，只添加數組中的項目，並在其數組中更新數量

Question

我有一個表單，用戶可以通過選擇複選框輸入詳細信息並選擇一個項目。

點擊添加按鈕檢查項目值和用戶輸入值存儲在數組中，我傳遞這些值在URL中。

用戶可以添加具有不同名稱和電子郵件的多個項目。假設我有三個項目，所以用戶可以選擇item1並填寫name1和email1並單擊add按鈕，同樣如果他選擇item1和item2並添加name2和email2，他可以添加這些值。

每次點擊我想如果它已經存在，檢查項目ID在陣列我不想添加它，只是增加該項目是已經存在於數組和更新數組新數量的數量

var allVals = []; //array where i am storing selected checkbox value 
jQuery("#btnadd").click(function(event) { //on click of this button i am getting all values to construct url and pass this value to multi div from where i will validate my url 
    var qty; 
    jQuery(".selectitem:checked").each(function() { 
      qty = jQuery(this).next().find('input[name="quantity"]').val()); //getting quantity of selected checkbox its a input field 
     if (jQuery.inArray(jQuery(this).val(), allVals) == -1) { 
      allVals.push(jQuery(this).val() + ',' + qty); //item id not present in array so adding item id,qty in array 
     } else { 
      qty = qty + 1; 
      //here i would like to increase quantity of those items only which already present in array something like this.qty and update my allVal array with this new quantity 
     } 
    }); 
var rslt = allVals.join(';'); jQuery('#multi').val(rslt); //updating multi div value with allVals from here i will make redirect. Just want to pass correct values in that field 
}); 

Answer 1

在數組中循環查找鍵並將qty更新爲值。

var qty; 
    jQuery(".selectitem:checked") 
     .each(function() { 
      qty = jQuery(this) 
      .next() 
      .find('input[name="quantity"]') 
      .val()); //getting quantity of selected checkbox its a input field 
     if (jQuery.inArray(jQuery(this) 
      .val(), allVals) == -1) { 
      allVals.push(jQuery(this) 
      .val() + ',' + qty); //item id not present in array so adding item id,qty in array 
     } else { 
      qty = qty + 1; 

      for (var i = 0; i < allVals.length; i++) { 
      if (allVals[i].Key == jQuery(this) 
       .val()) { 
       allVals[i].Value = qty; 
      } 
      } 
     }); 

Answer 2

問題：現在要插入兩個項目名稱和數量到像[item1,1,item2,1,...]一個陣列因此從技術上講，你有什麼珍惜你item1與相關聯的控制。即使你編寫一個邏輯來獲取項目名稱的下一個索引，它的效率也不高。

解決方案：我建議你到使用Object而不是數組。因爲有了對象，您可以使用property Name進行訪問併爲其分配值。它更強烈地耦合。見下面

var allVals = {}; // make it a object. 

的例子採用這種結構，你可以使用此代碼替換整個ifelse塊。

var key = jQuery(this).val(); 
allVals[key] = (allVals[key] || 0) + parseInt(qty,10); 

解釋上述語法。

• allVals[key] - 在這裏你的名字item1，item2等添加新的屬性/訪問exisitng財產......

• (allVals[key] || 0) - 如果屬性已經存在，使用它的價值。否則使用0，因爲它將是undefined。

• parseInt(qty,10); - 由於您正在進行數學運算，因此始終建議將數據轉換爲數字類型，然後執行數學運算。這裏如果你不使用parseint你的qty將是字符串，你會得到無效的結果。

隨着上述語法給出最終的語法應該是這樣..

var allVals = {}; 
jQuery("#btnadd").click(function(event) { 
    var qty; 
    jQuery(".selectitem:checked").each(function() { 
      qty = jQuery(this).next().find('input[name="quantity"]').val(); 
      var key = jQuery(this).val(); 
      allVals[key] = (allVals[key] || 0) + parseInt(qty,10); 
    }); 
//var rslt = allVals.join(';'); jQuery('#multi').val(rslt); 
// since your data structure has changed I am not sure if you need this. 
}); 

的allVals的最終數據將像..

{ 
item1 : 2, 
item2 : 3, 
item3 : 1, 
item4 : 1 
}