javascript代碼首先使用setTimeout工作，但然后崩潰或不起作用？

Question

我的代碼在最初的幾分鍾內工作，然后我的頁面崩潰或者之后無法工作 - 它有時會說我的內容應該“未定義”，我的代碼有什么問題？

$(document).ready(function(){
    test();
});

function test(){
    $.getJSON("http://graph.facebook.com/http://xzenweb.co.uk?callback=?", 
         function(data) {
         var name = data["shares"];
            var dataString = 'shares='+name;

            $.ajax({
                type: "POST",
                url: "index.php",
                data: dataString,
                cache: false,

                success: function(html)
                {
                $("#content").html(html);
                }
            });
            return false;  
         }); 
    setTimeout("test()",5000);
 }

php代碼：

if(isset($_POST["shares"])) {
    echo $_POST["shares"];
}

Answer 1

試試這個 - 注意我只在成功運行后調用超時：

另請注意，您可能會遇到允許執行的呼叫數限制

$(document).ready(function(){
  test();
});

function test(){
  $.getJSON("http://graph.facebook.com/http://xzenweb.co.uk?callback=?", 
     function(data) {
       var name = data["shares"];
       var dataString = 'shares='+name;
       $.ajax({
         type: "POST",
         url: "index.php",
         data: dataString,
         cache: false,
         success: function(html) {
           $("#content").html(html);
           setTimeout(test,5000);
         }
      });
   }); 
 }

這是對json循環的測試，直到數字改變或10次調用（因為用戶可能已經共享）

<!DOCTYPE html>
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf8-8">
  <title></title>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script>
  var savedData ="";
  var cnt = 10;
  $(document).ready(function(){
  test();
});

function test(){
  $.getJSON("http://graph.facebook.com/http://xzenweb.co.uk?callback=?", 
     function(data) {
       var shares = data["shares"];
// change this line to 
// $("#content").html(shares);
// when you are happy
       $("#content").html(cnt + ":"+shares+" - "+new Date());
       if (cnt > 0) {
         if (savedData == "" || savedData == shares ) {
           setTimeout(test,1000);
         }
       }
       savedData = shares;
       cnt--
  });
}

  </script>
  </head>
  <body>
<div id="content"></div>
  </body>
</html>

Answer 2

或者使用.done，.fail和.always是個好主意。 並在.always中執行setTimeout（無論請求是成功完成還是錯誤 - 失敗。）

$(document).ready(function(){
  test();
});

function test(){
  $.getJSON("http://graph.facebook.com/http://xzenweb.co.uk?callback=?", 
     function(data) {
       var name = data["shares"];
       var dataString = 'shares='+name;
       $.ajax({
         type: "POST",
         url: "index.php",
         data: dataString,
         cache: false
      })
      .done(function(html) { $("#content").html(html); })
      .always(function() { setTimeout(test,5000); })
   }); 
 }

或者在ajax中你可以使用complete來設置超時（確保在出錯時調用它），如下所示：

$.ajax({
         type: "POST",
         url: "index.php",
         data: dataString,
         cache: false,
         success: function(html) {
           $("#content").html(html);
         },
         complete: function() {
           setTimeout(test,5000);
         }
      });

Answer 3

這是我從上面的評論中建議的代碼。

var timeout; // create a variable named `timeout` assign nothing to it.

$(document).ready(function(){ // I really don't see the point in $(document).ready, if you include your code in the body of the document this should not be needed.
    test();
});

function test(){
    $.getJSON("http://graph.facebook.com/http://xzenweb.co.uk?callback=?", 
         function(data) {
         var name = data["shares"];
            var dataString = 'shares='+name;

            $.ajax({
                type: "POST",
                url: "index.php",
                data: dataString,
                cache: false,

                success: function(html)
                {
                    $("#content").html(html);
                },
                complete: function(xhr, status) { // I run after success and error callbacks have fired.
                   clearTimeout(timeout); // I clear any timeouts assigned to timeout variable. (these are denoted with an integer ID)
                   timeout = setTimeout(test , 5000); // knowing there is no longer a timeout waiting to fire, I can re-assign a timeout to the variable.
                }
            });
            return false;  
         }); 
}

我已經對代碼進行了更多評論，以幫助了解正在發生的事情。

關於jQuery.ajax，可以在這里閱讀更多內容
你也應該在這里閱讀setTimeout的機制

javascript代碼首先使用setTimeout工作，但然后崩潰或不起作用？

問題描述

3 個解決方案

解決方案1
0 2012-06-11 11:20:10

解決方案2
0 2012-06-11 11:44:09

解決方案3
0 2012-06-11 11:49:49

javascript代碼首先使用setTimeout工作，但然后崩潰或不起作用？

問題描述

3 個解決方案

解決方案1 0 2012-06-11 11:20:10

解決方案2 0 2012-06-11 11:44:09

解決方案3 0 2012-06-11 11:49:49

解決方案1
0 2012-06-11 11:20:10

解決方案2
0 2012-06-11 11:44:09

解決方案3
0 2012-06-11 11:49:49