Bagaimana untuk melaksanakan kemas kini data masa nyata dalam jquery php-masalah PHP-php.cn

Bagaimana untuk melaksanakan kemas kini data masa nyata dalam jquery php

藏色散人

Lepaskan： 2023-03-14 18:10:01

asal

3236 orang telah melayarinya

Cara melaksanakan kemas kini data masa nyata dalam jquery php: 1. Buat jadual data; 2. Sambungkan ke pangkalan data dengan mencipta fail pelayan "demo.php" dan lakukan operasi yang berkaitan; fresh.html" untuk memaparkan data Hanya halaman web.

Bagaimana untuk melaksanakan kemas kini data masa nyata dalam jquery php

Persekitaran pengendalian artikel ini: sistem Windows 7, PHP versi 7.1, komputer Dell G3.

Bagaimanakah jquery php melaksanakan kemas kini data masa nyata?

Contoh fungsi data muat semula dan paparan masa nyata yang dilaksanakan oleh php jQuery ajax

Butirannya adalah seperti berikut:

Buat jadual data: demo

--
-- 表的结构 `demo`
--
CREATE TABLE IF NOT EXISTS `demo` (
 `id` int(11) NOT NULL AUTO_INCREMENT,
 `name` varchar(20) COLLATE utf8_bin NOT NULL,
 PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_bin AUTO_INCREMENT=5 ;
--
-- 转存表中的数据 `demo`
--
INSERT INTO `demo` (`id`, `name`) VALUES
(1, &#39;雷军&#39;),
(2, &#39;马化腾&#39;),
(3, &#39;李彦宏&#39;),
(4, &#39;马云&#39;);

Salin selepas log masuk

Fail pelayan: demo.php

<?php
$mysqli = new mysqli("localhost","root","","test");
$mysqli->set_charset(&#39;utf8&#39;);
$query = &#39;SELECT * FROM demo&#39;;
$result = $mysqli->query($query);
$arr = $result->fetch_all(MYSQLI_ASSOC);
$info = json_encode($arr);
echo $json = &#39;{"success":true,"info":&#39;.$info.&#39;}&#39;;

Salin selepas log masuk

Paparan halaman web data: segar. html

<html>
<head>
  <meta charset=&#39;utf-8&#39;>
  <title>hello</title>
</head>
<body>
<script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
<script>
  function check(){
    $.ajax({
      type:"GET",
      url:"./demo.php",
      dataType:"json",
      success:function(data){
        if(data.success){
          var count = data.info.length;
            for(i=0;i<count;i++){
              var dom = "<tr align=&#39;center&#39; id=&#39;"+data.info[i].id+"&#39;><td>"+data.info[i].id+"</td><td>"+data.info[i].name+"</td></tr>";
              var tag = &#39;#&#39;+data.info[i].id;
              if(!$(tag).length){
                $("#info").append(dom);
              }
            }
        }else{
          alert(&#39;error&#39;);
        }
      },
      error:function(res){
        alert(res.status);
      }
    });
  }
  window.setInterval(check, 1000); //每秒执行一次
</script>
<body>
  <div style=&#39;width:600px;margin:0 auto;&#39;>
    <table border=&#39;1&#39; width="600px">
      <thead>
        <tr><th>id</th><th>name</th></tr>
      </thead>
      <tbody id=&#39;info&#39;>
        <tr align=&#39;center&#39; id=&#39;111&#39;><td>111</td><td>测试</td></tr>
      </tbody>
    </table>
  </div>
</body>
</html>

Salin selepas log masuk

Pembelajaran yang disyorkan: "Tutorial Video PHP"

Atas ialah kandungan terperinci Bagaimana untuk melaksanakan kemas kini data masa nyata dalam jquery php. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!