Question

我有一个div部分。我想每5秒重新加载一下这个部分。我该怎么做呢。这是我的代码：

<script>
    $("#send_parent_general_chat").submit(function() 
        {
            var rec = $("#data").val();
            var msg = $("#msg").val();
            var dataString = 'rec='+ rec + '&msg='+ msg;

            $.ajax({
                type: "POST",
                url: "<?php echo base_url(); ?>" + "Client/send_general_parent_chat_msg/<?php echo $per_job->id;?>",
                data: dataString,
                cache: false,
                success: function(result){
                    $('#display_general_msg').html(result);
                    $('#send_parent_general_chat')[0].reset(); //form reset

                }
            });
            return false;
        }); 
</script>


<script>
    $(document).ready(function(){
        setInterval(function(){
            //  alert("===111==");
            $("#display_general_msg").load('<?php echo base_url(); ?>" + "Client/refresh_general_parent_chat_msg/<?php echo $per_job->id;?>')
        }, 5000);
    });
</script>

我已经创建了一个用于刷新div的控制器我已经使用了时间间隔功能但它没有加载，它显示了这个错误：

禁止访问！您无权访问所请求的对象。它受读保护或服务器无法读取。如果您认为这是服务器错误，请与网站管理员联系。错误403 我只需要刷新div内容而不是整个页面。我如何实现这一目标？

Answer 1

您可以使用：

setTimeout(function()
{
  Your_Function(); //this will send request again and again;
}, 5000);

将Your_Function替换为您的功能名称。

希望这会有所帮助!!

Answer 2

你也可以尝试下面的一个：

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

setInterval方法将比setTimeout方法更准确

//或

  $(function(){  // document.ready function...
    setTimeout(function(){
      $('form').submit();
      },5000);
 });

Answer 3

下面是一个使用php websockets每5秒更新一次内容的示例。这是一个简单的示例，但您可以使用它进行修改以满足您的应用程序需求。您不需要客户端的超时功能，我们使用服务器sleep

安装Workerman socket library

composer require workerman/workerman

客户端代码

    <!DOCTYPE HTML>

<html>
   <head>

      <script type = "text/javascript">
         function WebSocketTest() {

            if ("WebSocket" in window) {
               //alert("WebSocket is supported by your Browser!");

               // Let us open a web socket
               var ws = new WebSocket("ws://localhost:2346");

               ws.onopen = function() {

                  // Web Socket is connected, send data using send()
                  ws.send("Message to send");
                  //alert("Message is sent...");
               };

               ws.onmessage = function (evt) { 
                  var received_msg = evt.data;
                  //alert("Message is received..." + received_msg);
                  document.getElementById("demo").innerHTML = "Timestamp is updated every 5 sec " +received_msg;
               };

               ws.onclose = function() { 

                  // websocket is closed.
                  alert("Connection is closed..."); 
               };
            } else {

               // The browser doesn't support WebSocket
               alert("WebSocket NOT supported by your Browser!");
            }
         }

      </script>

   </head>

   <body>
      <div id = "sse">
         <a href = "javascript:WebSocketTest()">Run WebSocket</a>
      </div>
      <div id="demo" style="font-size: 64px; color: red;"></div>

   </body>
</html>

服务器端代码

<?php
require_once __DIR__ . '/vendor/autoload.php';
use Workerman\Worker;

// Create a Websocket server
$ws_worker = new Worker("websocket://0.0.0.0:2346");

// 4 processes
$ws_worker->count = 4;

// Emitted when new connection come
$ws_worker->onConnect = function($connection)
{
    echo "New connection\n";
 };

// Emitted when data received
$ws_worker->onMessage = function($connection, $data)
{
    // Send hello $data
    while(true) {
        $connection->send(time());
        sleep(5); //Sleep for 5 seconds to send another message.
    }

};

// Emitted when connection closed
$ws_worker->onClose = function($connection)
{
    echo "Connection closed\n";
};

// Run worker
Worker::runAll();

可以使用终端中的以下命令启动后端服务，也可以根据需要在启动时自动启动。

$php index.php start

此处index.php是我们的后端文件名。

只需启动服务并加载页面，然后您就可以看到时间戳每5秒更新一次，来自服务器端。这是在我的本地计算机上测试的工作示例。如果您需要任何其他帮助，请尝试告诉我。

输出

使用动态数据自动刷新div

3 个答案: