Question

我们都在AJAX教程中看到了一些发送一些数据的例子。他们都（或多或少）看起来像：

var http = createRequestObject(); // shared between printResult() and doAjax()

function createRequestObject() { /* if FF/Safari/Chrome/IE ... */ ... }

function printResult() 
{ 
    if (http.readyState == 4) { ... } 
}

function doAjax() {
    var request = 'SomeURL';
    http.open('post', request);
    http.onreadystatechange = printResult;
    data = ...; // fill in the data
    http.send(data);
}

// trigger doAjax() from HTML code, by pressing some button

以下是我不完全理解的情况：如果按钮被快速按下几次怎么办？应该doAjax（）以某种方式重新初始化http对象？如果对象被重新初始化，那么已经播出的请求会发生什么？

PS：对主持人：这个问题可能与社区维基有关。如上所述（https://meta.stackexchange.com/questions/67581/community-wiki-checkbox-missing-in-action） - 如果我做对了 - 请正确标记这个问题。

Answer 1

由于AJAX具有异步性质，因此每次单击按钮都会引发异常事件，从而使某些数据从FROM / TO服务器获取/ POST。您提供一个回调，因此它将在服务器完成处理数据时被触发多次。

默认情况下这是正常行为，您不应重新初始化http对象。如果您想要提供多个发送操作，您必须手动执行此操作（例如，在首次调用时禁用按钮）。

我还建议使用jQuery $ .ajax，因为它包含了很多这些细节。

Answer 2

当然，现在有很多图书馆能够提供体面的工作，应该在生产环境中使用。但是，我的问题是关于引擎盖下的细节。所以在这里我发现了类似于lamda-calculus的方法，每个请求都有专用的请求对象。这些对象显然会传递给回调函数，该函数在响应到达时调用：

function printResult(http) {
  if (http.readyState == 4) { ... } 
  ...
}

function doAjax() {
    var http = createRequestObject();       
    var request = 'SomeURL';

    http.open('get', request);      
    http.onreadystatechange = function() { printResult(http); };
    http.send(null);
    return false; 
}

在Chrome和IE9下成功测试。

Answer 3

我使用了每页请求队列来处理这种情况（以抑制重复请求并确保请求的顺序），但可能有更标准化的解决方案。

由于默认情况下不提供此功能，因此您需要在页面（或链接脚本）中的JavaScript中实现它。单击按钮会向队列添加请求，而不是启动Ajax请求。如果队列为空，则执行Ajax请求，使用回调删除排队的条目并执行下一个条目（如果有的话）。

另请参阅：How to implement an ajax request queue using jQuery

管理多个ajax请求的正确方法是什么？

3 个答案: