Question

我对AJAX不是很熟悉，但我确定我想做的事情是可能的。

基本上我有一个带有文本区域的表单，当提交表单时，文本区域被制成一个数组，每个新行都是一个值。简单的东西，现在我的PHP然后对每个数组值执行数据库查询。也很简单。

现在由于操作需要一段时间我想使用jquery进入AJAX调用，并且对于数组上的每次迭代，我希望它在我的主页面上显示结果以及显示进度条。

因此，如果我的文本区域包含20,000个名称的列表，并且查询是为了获取这些人的年龄，则ajax调用会将textarea拆分为数组并迭代数组。对于每次迭代，它应该执行查询并将结果发送到我的主页面。因此，在我的主页上，我会看到一个随时间增长的列表。

我希望我已经解释得这么好，我只需要建议从哪里开始/研究什么。任何例子都将不胜感激。

谢谢！

Answer 1

AJAX请求只不过是从服务器请求数据，就像任何HTML页面一样。唯一的区别是您使用Javascript，并且不会将数据作为HTML页面提供给您的浏览器，而是以某种方式使用页面上的数据。

一种可能的方法来做你想要的事情如下：

使用刷新率设置间隔，该间隔调用函数getData
在getData中，您执行AJAX请求，该请求从服务器请求一段数据，该数据代表当前状态。您可能希望确保服务器仅返回增量更新，以避免发送大量数据
使用首页上的数据，以友好的方式向用户显示。

要记住的主要事情是服务器必须保存它的当前状态（它通过其查询收集的数据），它必须在发生AJAX请求时返回。

Answer 2

由于ajax只是对数据的请求，因此无法轻松创建可靠的加载栏。

但是如果你在问题中提出了大量的请求，那么“顺便说一下这不是最好的主意”。

您可以执行以下代码之类的操作。再次它非常基本，但会给你的用户一个粗略的想法。我把它放在这里为你摆弄http://jsfiddle.net/6dgAF/这是一个基本的例子，但应该给你一个跳跃点。

function Status(data)
{
    this.data = data;
    this.size = this.data.length;
    this.current = 0;
    this.bar = $("#bar");
    //Get width of each step of load
    this.step = (this.bar.width() / this.size) ;
    for(var i =0; i < this.size; i++){
     this.getData(this.data[i]);   
    }

}
Status.prototype.getData = function(string){
    //run your ajax here on each string and on success do this

    //$.get( "ajax/test.html", function( string ) {
         //this.current++;
          //this.updateBar();
        //});
    this.current++;
    this.updateBar();
}
Status.prototype.updateBar = function(){
    //updates the bar with the current count * step width;
    $("span",this.bar).width(this.step*this.current);
}

//Init object and put in dummy data
var status = new Status(new Array("string1","string2","string3","string4","string5","string6","string7","string8","string9","string10"));

Answer 3

你想要的是什么叫 XHR2 - 我个人使用的是dojo （dojo / request / xhr here）

然而，应该可以使用jQuery，搜索jQuery XHR2进度......

数组迭代的AJAX进度条？

3 个答案: