【问题标题】:AJAX jQuery refresh div every 5 secondsAJAX jQuery 每 5 秒刷新一次 div
【发布时间】:2014-10-16 06:50:11
【问题描述】:

我从一个网站上获得了这段代码,并根据我的需要进行了修改:

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
</head>

<div id="links">

</div>

<script language="javascript" type="text/javascript">
var timeout = setTimeout(reloadChat, 5000);

function reloadChat () {
$('#links').load('test.php #links',function () {
        $(this).unwrap();
        timeout = setTimeout(reloadChat, 5000);
});
}
</script>

在test.php中:

<?php echo 'test'; ?>

所以我希望在链接 div 中每 5 秒调用一次 test.php。我怎样才能做到这一点?

【问题讨论】:

  • 你包含jquery库吗
  • 是的,我在头顶得到了
  • 您使用的是旧版本的 ogf jquery ,请尝试最新版本
  • AJAX 轮询是一种反模式,应该不惜一切代价避免。它不是一个可扩展的解决方案,并且会以最小的并发负载导致服务器端性能问题。当您需要保持客户端/服务器端数据紧密同步时,一个更好的解决方案是使用观察者模式。在这种情况下,websockets。

标签: javascript php jquery ajax


【解决方案1】:

试试这个。

function loadlink(){
    $('#links').load('test.php',function () {
         $(this).unwrap();
    });
}

loadlink(); // This will run on page load
setInterval(function(){
    loadlink() // this will run after every 5 seconds
}, 5000);

希望这会有所帮助。

【讨论】:

  • 用 $(this).unwrap(); 更新了我的答案;在这种情况下,您将不需要 timeout = setTimeout(reloadChat, 5000);
  • 它不起作用,ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js 是正确的库吗?
  • 哦,等一下,它正在工作,谢谢 :) 但是“测试”在页面加载后 5 秒出现,是立即加载然后每 5 秒刷新一次的方法吗?
  • 现在完美了 :) 谢谢
  • @rupesh 你能告诉一些其他的方法来从服务器获取新数据而不向服务器发送请求吗?如果要求是每 5 秒刷新一次。谢谢!
【解决方案2】:

尝试使用setInterval 并包含jquery library 并尝试删除unwrap()

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">

var timeout = setInterval(reloadChat, 5000);    
function reloadChat () {

     $('#links').load('test.php');
}
</script>

更新

您使用的是 jquery 旧版本,因此请包含最新的 jquery 版本

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

【讨论】:

    【解决方案3】:

    尽量不要使用setInterval
    您可以在超时成功响应后重新向服务器发送请求。
    jQuery:

    sendRequest(); //call function

    function sendRequest(){
        $.ajax({
            url: "test.php",
            success: 
            function(result){
                $('#links').text(result); //insert text of test.php into your div
                setTimeout(function(){
                    sendRequest(); //this will send request again and again;
                }, 5000);
            }
        });
    }
    

    【讨论】:

    • 你能解释一下为什么不 setInterval 吗?
    • 这个答案导致了另一个答案stackoverflow.com/a/5052661/3842368,它建议将其从“成功”转移到“完成”。赞成。
    【解决方案4】:

    你可以用这个。

    <div id="test"></div>
    

    你的java脚本代码应该是这样的。

    setInterval(function(){
          $('#test').load('test.php');
     },5000);
    

    【讨论】:

      【解决方案5】:
      <script type="text/javascript">
      $(document).ready(function(){
        refreshTable();
      });
      
      function refreshTable(){
          $('#tableHolder').load('getTable.php', function(){
             setTimeout(refreshTable, 5000);
          });
      }
      </script>
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2022-07-06
        • 1970-01-01
        • 2016-10-14
        • 1970-01-01
        • 2016-03-21
        • 2014-03-15
        • 2012-06-13
        相关资源
        最近更新 更多