Question

我正在尝试使用另一个jquery .each循环创建一个循环，以动态创建一个包含.xml文件信息的表。下面代码的结果导致最后一个表条目获取所有xml信息，即DoM31。我不知道为什么会这样。

function ttrpdom() {
  for (var i=0;i<31;i++) {
    var mypost = 'http://mysite/TotalDailyRes' + i + '.xml';
    var dm = '#DoM' + i;
    $.post(mypost, function(data) {
      $(data).find('opensearch\\:totalResults').each(function() {
        var res = $(this).text();
        $(dm).append('<td>' + res + '</td>');
      });
    } , 'text');
  }
}

Answer 1

for函数调用未阻止$.post循环。因此即使POST请求尚未完成，i和dm也会继续更改。

代码的演练：

i === 0
Set `mypost` variable to `http://mysite/TotalDailyRes0.xml`
Set `dm` variable to `#DoM0`
Make POST request to `mypost`
Loop

Increment i
i === 1
Set `mypost` variable to `http://mysite/TotalDailyRes1.xml`
Set `dm` variable to `#DoM1`
Make POST request to `mypost`
Loop

....    

Increment i
i === 30
Set `mypost` variable to `http://mysite/TotalDailyRes30.xml`
Set `dm` variable to `#DoM30`
Make POST request to `mypost`

END LOOP

....

POST http://mysite/TotalDailyRes0.xml completes
Fire `function(data)` callback
dm === '#Dom30'

POST http://mysite/TotalDailyRes1.xml completes
Fire `function(data)` callback
dm === '#Dom30'

....

POST http://mysite/TotalDailyRes30.xml completes
Fire `function(data)` callback
dm === '#Dom30'

此外，无法保证POST请求将按顺序完成。 http://mysite/TotalDailyRes28.xml的请求可能会在http://mysite/TotalDailyRes30.xml之前完成。

解决方案是检测已完成的URL并使用它来构建HTML ID。此外 - 由于请求不会改变服务器上的数据，因此GET请求更适用于此上下文：

    $.get(mypost, function(data) {
      var i = parseInt(this.url.replace('http://mysite/TotalDailyRes', ''), 10),
      dm = '#DoM' + i;
      $(data).find('opensearch\\:totalResults').each(function() {
        var res = $(this).text();
        $(dm).append('<td>' + res + '</td>');
      });
    } , 'text');

动态jquery循环与另一个jquery .each循环

1 个答案: