在继续之前,我如何保证执行jQuery Every语句?

时间:2013-09-10 08:58:47

标签: javascript jquery ajax

我的代码如下:

$(".qtyfield").each(function (index) {
    if (this.value != "" && this.value > 0) {
        var fieldname = this.id;
        countme = countme + 1;
        var tmpProductID = fieldname.split("_")
        var ProductID = tmpProductID[1];
        var ShowPrice = $(this).closest('td').prev('td').text();
        var Quantity = this.value;
        ShowPrice = ShowPrice.replace("$", "");
        isItemInCart(ProductID).done(function () {
            if (isItemInCartVar) {
                updateQuantityByProductID(ProductID, Quantity);
            }
            else {
                addToCartWithQty(ProductID, ShowPrice, Quantity);
            }

        });
        this.value = '';
    }
});

在运行任何进一步的语句之前,我需要确保此代码块完成(包括所有ajax调用)。

有几点......

  1. isItemInCart是一个带有Ajax调用的函数
  2. updateQuantityByProductID是一个带有ajax调用的函数
  3. addToCartWithQty是一个带有ajax调用的函数
  4. 我不知道每个集合中有多少项(可能会有变化)

3 个答案:

答案 0 :(得分:2)

我会重构代码,以便each循环是服务器端。这样,您可以在客户端上准备阵列,使用ajax(使用唯一调用)发送它,然后将其解压缩到您将拥有each循环的服务器上。 如果你的每个循环都有数十亿个元素怎么办?乘以html标题的长度。

相反,您可以像这样准备数组。

var serverSide = [];

$(".qtyfield").each(function (index) {

    serverSide.push("the data you need");

});

然后你可以把它作为JSON字符串发送

var myArg = JSON.stringify(serverSide)

或以逗号分隔的列表(对于更简单的结构)

var myArg = serverSide.join(',');

并具有唯一的ajax调用,可以返回任何值/错误消息

$.post("link", myArg).success(function(data){ alert("data"); })

我不知道您拥有哪种服务器端支持,但如果您使用的是PHP,则可以使用json_decode解码JSON字符串。

如果您使用的是C#,可能需要查看JSON.net

无论哪种方式,你都会有更多的灵活性。相反,在客户端上执行每个循环时,它可能不是最佳解决方案。 Ajax调用有标题。

答案 1 :(得分:2)

我的解决方案是在一次通话中整合所有这些逻辑,例如updateCart()

在客户端,您将创建需要更新的产品列表,例如

[
  {productId: 123, quantity: 2, price: 123},
  {productId: 456, quantity: 1, price: 200}
]

此数据将发送到服务器端,会话数据将使用新数量进行更新。基本上,服务器端的代码将执行与您在所有单个调用中相同的逻辑,但它会快得多,因为只有一个请求。

单个请求还可以降低会话锁争用的可能性,并提高购物车状态的一致性。

在客户端,只有一个回调函数的优点,而不是必须创建一个需要同步的单个请求的管道(读取:屁股中的巨大痛苦)。

答案 2 :(得分:0)

寻找jQuery延迟。每次$.ajax调用都会返回一个“承诺”,您可以等待解决:

var promise1 = $.ajax(...)
var promise2 = $.ajax(...)

然后等待他们解决:

$.when(promise1, promise2).then(function(){
  //ready to rumble
});

正如您所提到的,您不知道每个集合中有多少项,只需将每个承诺推送到一个数组中,该数组可以在$.when中使用,如下所示:

var promises = [];
promises.push($.ajax(...));
$.when.apply(this, promises).then(function(){...});