上一次完成后，立即加载一个链接列表

load list of links one at a time as soon as previous finishes

本文关键字：一个 列表 链接 加载 上一次      更新时间：2023-09-26

类似于使用jquery一次显示iframe中的链接列表，但不使用setTimeout函数，因为我宁愿在上一个文档加载完成后开始下一次获取。

我是javascript的新手，jquery更是如此，但这是我的第一枪：

links = ["http://example1.com","http://example2.com","http://example3.com"]
function loadNext(x){
  if ( x < links.length ){
    $('#target').load('links[x]');
    $('#target').ready(function(){
        x++;
        loadNext(x);
    });
  };
};
$(document).ready(function(){
  $('.loader').click(function(){
    loadNext(0);
  });
});
</script>
<div id="bd" role="main">
    <ul>
      <li><a href="#" class="loader">Start loading</a></li>
    </ul>
    <div id="target"></div>
</div>

我真的不明白为什么这不起作用。至少这个逻辑看起来是正确的。单击fire，传入一个索引为0的函数，然后在id="target"中加载该数组值（完整url），并在该目标准备好后再次运行该函数。点击似乎甚至不会加载第一个目标，更不用说迭代了（我本以为它会重定向第一次点击，直到我找到代理…）

假设您在代码中的某个地方定义了links。尝试使用load方法的回调功能在上一次加载完成后调用loadNext。

function loadNext(x){
  if ( x < links.length ){
    $('#target').load(links[x], function(){
        loadNext(x++);
    });
  }
}

使用以上代码，每次加载都将覆盖#target中以前的内容。如果你想保留它，那就用这个。

function loadNext(x){
  if ( x < links.length ){
    $('#target').append($('<div />').load(links[x], function(){
        loadNext(x++);
       })
    );
  }
}

更新：

如果您试图使用load访问外部URL，那么由于跨域访问限制，它将不起作用。但是有一些方法可以使用JSONP、YQL等从外部网站获取内容。

看看这个链接http://icant.co.uk/articles/crossdomain-ajax-with-jquery/using-yql.html

以下改进应该会有所帮助：

$('#target').append($("<div>").load(links[x], function() {
    loadNext(x+1);
});
  • load()接受回调函数作为参数，您应该使用它
  • 'links[x]'被视为URL，因此删除单引号（假设links存在）
  • load()覆盖#target的内容，因此与append()结合

好吧，您的脚本只是不是有效的代码。如果CCD_ 12被认为是一个数组，那么CCD_。load('links[x]')不正确。未声明links。您正在函数中调用同一个函数，并且您有许多意外的;。ready()并不是你想象的那样。恐怕你得重新考虑这整件事了。

相关文章：