如果內容更改，自動刷新JS數組？

我有這個JavaScript函數向外部PHP腳本提供AJAX請求，如果新檢查與舊檢查不同，我希望這會自動更新HTML <div>。如果內容更改，自動刷新JS數組？

<script> 
window.setInterval(function() 
{ 
    $(function() 
    { 
    $.ajax({          
     url: 'api.php', data: "", dataType: 'json', success: function(rows)   
     { 
      for (var i in rows) 
      { 
       var row = rows[i];   
       var id = row[0]; 
       var vname = row[1]; 
       var Password = row[2] 
       $('#output').append("<hr />").append("<b>id: </b>"+id+"<b> name: </b>"+vname+" <b>Password: </b>"+Password); 
      } 
     } 
    });  
    }); 
}, 5000); 
    </script>

目前這成功地返回，並與該數組中的內容更新DIV，問題是，因爲加入window.setInterval(function()線，將服務器的連接，每5秒，並重複數據更新<div> ..當所有我想要的，它爲它呼應了新的數據（如果有紐約州）

這是我其他的PHP腳本：

$STD = new mysqli ("localhost", "root", "hidden", "ajaxrequests"); 

     $array = array(); 
    $Query = $STD->prepare ("SELECT * FROM ajaxdata"); 
    $Query->execute(); 
    $Query->bind_result($ID, $Name, $Password); 

    while ($Query->fetch()) 
    { 
     $array[] = array ($ID, $Name, $Password); 
    } 

    echo json_encode($array);

來源

2013-03-07 user2146021

爲什麼使用append而不是隻寫整個輸出？另外，如果你想使用JSON字符串本身並假設JSON字符串不是太大，也許你只是將最近的字符串存儲到一個變量中，將它與傳入的字符串進行比較，如果匹配，則不做任何事情。如果它們不匹配，則用新數據覆蓋整個DOM元素。 – 2013-03-07 20:46:31

@MikeBrant你能提供一個例子嗎？ – user2146021 2013-03-07 20:49:06

@MikeBrant此外，它已建立，它已經每隔5秒發送請求並存儲響應。爲什麼不直接用每個請求來替換內容？無論如何（因爲瀏覽器緩存非常高效），比較返回的內容和當前內容將花費比簡單地更新DOM更長的時間。如果你的響應真的很大，那麼你可能想要在服務器端對它進行哈希處理，並只比較哈希瀏覽器端來檢查更新。 – 2013-03-07 20:52:15

你的循環之前，只需添加到empty()通話。

<script> 
window.setInterval(function() 
{ 
    $(function() 
    { 
    $.ajax({          
     url: 'api.php', data: "", dataType: 'json', success: function(rows)   
     { 
      $('#output').empty(); 
      for (var i in rows) 
      { 
       var row = rows[i];   
       var id = row[0]; 
       var vname = row[1]; 
       var Password = row[2] 
       $('#output').append("<hr />").append("<b>id: </b>"+id+"<b> name: </b>"+vname+" <b>Password: </b>"+Password); 
      } 
     } 
    });  
    }); 
}, 5000); 
</script>

當然，如果您的數據量很大，這不會是非常優化的。我實際上建議讓PHP服務器發送一個時間戳值與它的響應。然後，您可以在後續的AJAX請求中將其傳回，並讓服務器確定自上次時間戳以來是否存在實際的更新。然後您可以讓服務器只發送更新的記錄，您可以添加/更新類似於您已經在做的事情。

來源

2013-03-07 20:52:56

我會+1，但我沒有15重新。但是當定時器啓動時，我會接受這個答案。謝謝你的迴應，我並不是要求一個例子......但是，我已經給予的方式，有沒有更簡單的方法來解決這個問題？只是一個簡單的是或否的答案會衝浪 – user2146021 2013-03-07 20:55:35

@ user2146021與編程世界中的所有內容一樣，最好的方法通常針對您的用例。如果我正在處理大型數據集，我當然不希望每5秒傳遞完整的數據集，然後請客戶端瀏覽器全面更新。我會考慮在服務器和客戶端之間只傳遞增量數據更改的方法。您目前的方法很簡單，可以在可預見的未來滿足您的需求。只有你可以決定是否值得你實現的努力是更優化的方法。 – 2013-03-07 20:58:11

非常感謝您的時間！謝謝！ – user2146021 2013-03-07 21:01:45

如果內容更改，自動刷新JS數組？

回答

相關問題