Question

我有一个表单，用户可以通过选择复选框输入详细信息并选择项目。

单击添加按钮选中的项目值和存储在数组中的用户输入值，我将在url中传递这些值。

用户可以使用不同的名称和电子邮件添加多个项目。假设我有三个项目，因此用户可以选择item1并填写name1和email1并单击添加按钮，同样如果他选择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

问题：现在您将项目名称和数量都插入到[item1,1,item2,1,...]这样的数组中所以从技术上讲，您无法控制item1关联的值用。即使你编写一个逻辑来获取项目名称的下一个索引也不高效。

解决方案：我建议你使用Object 而不是数组。因为使用对象，您可以使用property Name进行访问并为其分配值。它的耦合更强烈。请参阅下面的示例

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

使用此结构，您可以使用此代码替换整个if else块。

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 
}

Answer 2

在数组中循环以查找键并将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;
             }
           }
         });

Jquery - 仅在数组中添加项目（如果不存在），并在数组中更新其数量

2 个答案: