在 jQuery .submit 函数期间更新然后显示变量

Question

我正在设置页面加载：

var qty = 1;

然后，在页面内，用户选择一个产品并选择一个数量，该数量被捕获为变量clicks。

然后我希望单击button#addToInventory，它将更新 qty 变量并将其显示在控制台中。我正在尝试如下：

$("#addToInventory").submit(function(event){qty = clicks;console.log(" QTY: " + qty );})

这不起作用（无论设置值如何，控制台都会显示 1 的数量，但是在单击按钮后立即，如果我随后手动键入 console.log(" QTY: " + qty ) 我看到控制台中设置的正确数量。

我尝试如下延迟 console.log，但这也不起作用：

$("#addToInventory").submit(function(event){qty = clicks;setTimeout(function (){console.log( " QTY: " + qty );}, 1000);})

--编辑--

以上是生产代码的简化示例，如下：

$.ajax(settings).done(function(response) {
    var output = "";
    for (i in response.Products) {
        var productID = response.Products[i].ProductId;
        var name = response.Products[i].Name;
        var imagePath = response.Products[i].ImagePath;
        var EAN = response.Products[i].EANBarcode;
        var price = response.Products[i].PriceDescription;
        var offer = response.Products[i].OfferPromotion;
        var offerValid = response.Products[i].OfferValidity;
        var qty = 0;
        output += "<div class='uk-width-medium-1-4'> <div class='md-card'> <div class='md-card-head uk-text-center uk-position-relative'> <div class='uk-badge uk-badge-danger uk-position-absolute uk-position-top-left uk-margin-left uk-margin-top'>" + price + "</div><img class='md-card-head-img' src='" + imagePath + "'/> </div><div class='md-card-content'> <h4 class='heading_c uk-margin-bottom'>" + name + "<span class='sub-heading'>SKU: " + EAN + "</span></h4> <p>" + offer + "</p><p><i>" + offerValid + "</i></p><div align='center'><button data-uk-modal=\"{target:'#modal_" + productID + "'}\" class=\"md-btn md-btn-flat md-btn-flat-primary\" >ADD TO INVENTORY</button><div class=\"uk-modal\" id=\"modal_" + productID + "\"> <div class=\"uk-modal-dialog\"> <div class='uk-modal-header'> <h3 class='uk-modal-title md-card-toolbar-heading-text'><i class='md-icon material-icons'>&#xE254;</i> QTY To Add</h3> </div><p class='uk-text-left'>How many <i><b>" + name + "</b></i> do you want to add to your home inventory : <br></p><div class='uk-text-center'> <form id='addToInventory_" + productID + "'> </p><br><h2> <table class='uk-table uk-table-popup uk-table-hover-popup'> <tbody> <td class='uk-text-center' type='button' onClick='clicks_" + productID + "--;updateClickCount_" + productID + "();' id='push-'><i class='md-icon material-icons'>&#xE15B;</i></td><td class='uk-text-center' id='clickCount_" + productID + "'>1</td><td class='uk-text-center' type='button' onClick='clicks_" + productID + "++;updateClickCount_" + productID + "();' id='push+'><i class='md-icon material-icons'>&#xE145;</i></td></tbody> </table> </h2> <br></p><button id='addToInventory_" + productID + "-submit' type='submit' class='md-btn md-btn-flat md-btn-flat-primary'>ADD TO INVENTORY</button></form><scr" + "ipt type=\"application/javascript\">var clicks_" + productID + " = 1;var minimum = 1;function updateClickCount_" + productID + "() {if (clicks >= minimum) {document.getElementById('clickCount_" + productID + "').innerHTML = clicks_" + productID + ";} else {clicks_" + productID + " = 1;document.getElementById('clickCount_" + productID + "').innerHTML = clicks_" + productID + ";}}  $(\"#addToInventory_" + productID + "\").submit(function(event){qty = 0;console.log('QTY IS: '+qty+' CLICKS Are: '+clicks_"+productID+");qty = clicks_"+productID+";setTimeout(function (){console.log(\""+ name + " QTY: " + qty +"\");}, 1000);})  </scr" + "ipt></div></div></div></div></div></div></div>";   
    }
    $("#allResults").html(output);
    $("#searchTerm").html(searchTerm);
});

});

Answer 1

您的 qty 将始终为 1，因为您正在创建变量并在 for 循环中将其分配为 0。每次运行 for 循环时，都会创建一个新的 qty var，并将其设置为 0，然后为迭代变量 (i) 赋予 1 值。因此，在循环中实例化 qty 的事实永远不会增加。

如果将 qty 变量移出 for 循环，它应该可以工作。

var qty = 0;
For (.............) {

// your code here

}