可能暂停直到ajax请求完成或停止ajax请求?

时间:2011-05-26 21:22:24

标签: jquery ajax drop-down-menu

我有一个在selectbox更改事件上调用的函数。在我的功能里面:
  代码:

            $("#male").ajaxAddOption(maleUrl, {}, false);
            $("#female").ajaxAddOption(femaleUrl, {}, false); 

按预期工作,但这是一个小小的车。例如,如果那些ajax请求需要一些时间来完成,并且如果我在那些ajax请求当前正在运行时再次调用该函数,我将接收第一个数据,同时还接收第二个请求的数据。现在两个请求都将填充选择框。这种情况不会经常发生,当它变得有点烦人时。我不太确定如何规避这个问题。任何提示/想法,以防止这种情况发生?我想在请求完成之前禁用selectbox,但我不确定如何实现这一点,因为我正在使用来自http://www.texotela.co.uk/code/jquery/select/的Select box操作。我查看了插件的代码,我注意到该插件使用了$ .getJSON。

已编辑的插件getJSON代码:

$.fn.ajaxAddOption = function(url, params, select, fn, args)
{
    var ajaxRunning = false;

    $(window).ajaxStart(function () {
      ajaxRunning = true;
    }).ajaxStop(function () {
      ajaxRunning = false;
    });

    if(typeof(url) != "string") return this;
    if(typeof(params) != "object") params = {};
    if(typeof(select) != "boolean") select = true;
    this.each(
        function()
        {
            var el = this;
            if (!ajaxRunning) {

                $.getJSON(url,
                    params,
                    function(r)
                    {
                        $(el).addOption(r, select);
                        if(typeof fn == "function")
                        {
                            if(typeof args == "object")
                            {
                                fn.apply(el, args);
                            } 
                            else
                            {
                                fn.call(el);
                            }
                        }
                    }
                );
            }
        }
    );
    return this;
};

编辑插件代码并不完全超出我的范围;但是,由于我对内部工作缺乏了解,我不想让插件无法使用。

3 个答案:

答案 0 :(得分:2)

你正在处理AJAX的一个更好的怪癖 - 并发。你有几个选择。您可以将请求的异步设置为false,但我个人会像瘟疫一样避免这种情况。更好的选择(恕我直言)是基于ajaxStart和ajaxStop设置事件,其状态变量可防止其他请求被触发。像这样的东西(尽管它需要适应你现有的代码)。

var ajaxRunning = false;

$(window).ajaxStart(function () {
  ajaxRunning = true;
}).ajaxStop(function () {
  ajaxRunning = false;
});

创建一个可用于控制请求的变量,如下所示:

$('.mySelect').change(function () {
  if (!ajaxRunning) {
    $.getJSON(); // Your complete code here.
  }
});

设置它以便选择列表的更改处理程序仅在当前没有处理时才会触发其AJAX调用。

答案 1 :(得分:2)

你需要中止ajax调用。

ajax = $.getJSON(//..params);

ajax.abort();

答案 2 :(得分:0)

两个代码示例都很精彩,我感谢你们两位帮助我。我确实为jquery找到了一个很棒的插件,可以满足我的需求。 link:http://code.google.com/p/jquery-ajaxq/ ajaxq将每个ajax请求存储到队列中,并在请求完成时按顺序触发它们。