2011-03-09 72 views
3

请注意这个问题上的帮助: 在一个循环中,我首先调用一个函数,它将更改DIV的内容,然后尝试显示新的内容。该代码是(简述):如果我添加一个“警报”

while (...){ 
    fetch(website_url); 
// alert("useless"); 
    x=document.getElementById("prova").textContent; 
    alert(x); 
} 

“魂”是使用jQuery来打开指定的URL并粘贴在DIV“PROVA”内容的功能。看到评论“警报”?如果我保留它的评论,“抓取”完美地工作(我在浏览器窗口中看到取回的代码),但第二个警报不是!它显示了过去的DIV内容(即,第一次是空白的,在第二次迭代时将显示第一次迭代的内容等)。 但是,如果我取消注释第一个警报,第二个警报正常工作。 它看起来像一个同步问题,但我尝试了很多方法(即超时,ifs,..),但我一直无法解决它。任何建议?

这里是取功能(其实这不是我的......我只是在学习如何使用它)

function fetch(url){ 
    container = $('#prova'); 
    doAjax(url); 

    function doAjax(url){ 
    $.getJSON("http://query.yahooapis.com/v1/public /yql?"+"q=select%20*%20from%20html%20where%20url%3D%22"+encodeURIComponent(url)+"%22&format=xml'&callback=?", 
function(data){ 
    if(data.results[0]){ 
     var data = filterData(data.results[0]); 
     container.html(data); 
    } else { 
     var errormsg = '<p>Error: could not load the page.</p>'; 
     container.html(errormsg); 
    } 
    } 
} 
+0

fetch()的外观是什么? – charisis 2011-03-09 09:56:41

+0

我怀疑它是jQuery.load或其中一种相关的风格,但我同意,看到fetch()实现将会很有帮助。 – 2011-03-09 10:03:46

回答

1

你似乎完全无视什么AJAX 这里:你正在做一个异步页面请求,雅虎,这意味着您将浏览器发出请求,然后继续处理你的脚本,而你等待。这是完整的目的。

响应文本不可用后立即设置呼叫,但是当你添加一个alert您要添加一个人有关的延迟是恰好足够长的异步请求回来,在你的情况。

你可以做AJAX请求同步(“AJAX”为“异步JavaScript和XML”是用词不当,并更好地叫XmlHttpRequest的):

var url = "http://query.yahooapis.com/v1/public /yql?"+"q=select%20*%20from%20html%20where%20url%3D%22"+encodeURIComponent(url)+"%22&format=xml'&callback=?"; 

// Your asynchronous call: 
$.getJSON(url, function(data) { ... }); 

// A synchronous alternative: 
$.ajax({ 
    type: 'GET', 
    url: url, 
    dataType: 'json', 
    data: {}, 
    async: false, 
    success: function(data) { ... }, 
    }); 

现在,请求将完成(或失败)之前你的代码继续。

或者,以保持异步请求,您可以将您希望它完成步入回调函数发生后,代码:

while (...) { 
    function myFunction() { 
     var x = document.getElementById("prova").textContent; 
     alert(x); 
    } 
    fetch_and_handle(website_url, myFunction); 
} 

function fetch_and_handle(url, handler) { 
    var container = $('#prova'); 
    var url  = "http://query.yahooapis.com/v1/public /yql?"+"q=select%20*%20from%20html%20where%20url%3D%22"+encodeURIComponent(url)+"%22&format=xml'&callback=?"; 

    $.getJSON(url, function(data) { 
     if (data.results[0]) { 
      var data = filterData(data.results[0]); 
      container.html(data); 

      if (handler != undefined) { 
       handler(); 
      } 
     } 
     else { 
      var errormsg = '<p>Error: could not load the page.</p>'; 
      container.html(errormsg); 
     } 
    } 
} 

我也有几个地方添加var:当你”重新创建一个局部变量,使用var。我固定了一些缩进。

+0

非常感谢。我仍然对回调函数根本没有信心,但现在事情效果更好。 如果我理解正确,那么我需要对获取的内容进行的所有进一步的数据操作都必须嵌套在回调函数内(或由其调用)(即,取代“警告”)...正确? – Bob 2011-03-09 11:02:42

+0

@Bob:这是对的。 – 2011-03-09 11:04:15

0

听起来像是你没有带明白什么是异步通信或者它是如何工作。在你的代码,当该行被执行:

x=document.getElementById("prova").textContent; 

的AJAX调用(fetch())仍在运行。通过放置“无用的”警报,ajax-call有时间完成,因为下面的行会等待你在执行之前点击“ok”。

解决这个问题,你有两个possibilitys:

  1. 改变你的要求是同步的(但是那是一个坏主意,几乎每一次)
  2. 使用你的Ajax请求的成功回调至执行代码应等待请求完成

编辑:你没有带张贴您的fetch()代码,所以它是猜想的问题,您使用一些jquerys的Ajax-functi的在那里......发布完整的代码本来不错。

+0

感谢您的帮助。我如何使我的请求同步(我还没有那么多Ajax)? – Bob 2011-03-09 10:02:09

+0

查看文档:http://api.jquery.com/jQuery.ajax/ - 一个名为'async'的选项必须设置为'false'(默认为'true')。但是:你真的,真的,真的,不应该这样做。 _使用回调。特别是如果你不知道你在做什么。 – oezi 2011-03-09 10:06:37

+0

请不要张贴代码,这是一个恐怖的阅读。编辑你的第一个问题并追加这些信息。 – oezi 2011-03-09 10:10:21

1

此代码取决于时间。第一条警报创建一个延迟,在此期间完成读取。

你想要做的就是使用带回调的jQuery ajax,例如

$.get('ajax/test.html', function(data) { 
    $('.result').html(data); 
    alert('Load was performed.'); 
}); 

看到http://api.jquery.com/jQuery.get/

+0

我对Ajax并不擅长,但这也是我的猜想。我曾尝试在Javascript代码中实现与其他循环和延迟相同的结果,但没有成功。我会尝试你的建议。谢谢 – Bob 2011-03-09 10:00:23

+0

所以,你在正确的轨道上。在回调函数(data){}实现中添加您想要执行的代码。 – 2011-03-09 10:09:15

相关问题