php教程
js文档Node.jsVue.jsReactjQueryES2015(es6)angularjscss3动画vbs最新电影flutter微信小程序C教程java教程C++教程C#教程php教程sql教程mysql教程android教程ios教程python教程正则表达式

jquery php如何实现实时数据更新

发布时间：2022-05-25 发布网站：脚本宝典
脚本宝典收集整理的这篇文章主要介绍了jquery php如何实现实时数据更新，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

jquery phP实现实时数据更新的方法：1、创建数据表；2、通过创建服务器文件“demo.php”连接数据库并进行相关操作；3、创建显示数据的“fresh.htML”网页即可。

jquery php如何实现实时数据更新

本文操作环境：Windows7系统、PHP7.1版、Dell G3电脑。

jquery php如何实现实时数据更新?

php+jQuery ajax实现的实时刷新显示数据功能示例

具体如下：

创建数据表：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, '雷军'),
(2, '马化腾'),
(3, '李彦宏'),
(4, '马云');

服务器文件：demo.php

<?php
$MySQLi = new mySQLi("localhost","root","","test");
$mysqli->set_charset('utf8');
$query = 'SELECT * From demo';
$result = $mysqli->query($query);
$arr = $result->fetch_all(MYSQLI_ASSOC);
$info = json_encode($arr);
echo $JSON = '{"success":true,"info":'.$info.'}';

显示数据网页: fresh.html

<html>
<head>
  <;meta charset='utf-8'>
  <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='center' id='"+data.info[i].id+"'><td>"+data.info[i].id+"</td><td>"+data.info[i].name+"</td></tr>";
              var tag = '#'+data.info[i].id;
              if(!$(tag).length){
                $("#info").append(dom);
              }
            }
        }else{
          alert('error');
        }
      },
      error:function(res){
        alert(res.status);
      }
    });
  }
  window.setInterval(check, 1000); //每秒执行一次
</script>
<body>
  <div style='width:600px;margin:0 auto;'>
    <table border='1' width="600px">
      <thead>
        <tr><th>id</th><th>name</th></tr>
      </thead>
      <tbody id='info'>
        <tr align='center' id='111'><td>111</td><td>测试</td></tr>
      </tbody>
    </table>
  </div>
</body>
</html>

推荐学习：《PHP视频教程》

以上就是jquery php如何实现实时数据更新的详细内容，更多请关注脚本宝典其它相关文章！

脚本宝典总结

以上是脚本宝典为你收集整理的jquery php如何实现实时数据更新全部内容，希望文章能够帮你解决jquery php如何实现实时数据更新所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。
标签：php
猜你在找的php教程相关文章
其他相关热搜词更多
phpjavapython程序员loadpost-format-gallerydivString参数开发ListcapMapClass工具安装SQL数据库资源this
全站导航更多
html5HTML/XhtmlCSSXML/XSLTDreamweaver教程Frontpage教程心得技巧JavaScriptASP.NETPHP编程正则表达式AJAX相关ASP编程JSP编程编程10000问CSS/HTMLFlexvbsDOS/BAThtahtcpythonperl游戏相关VBA远程脚本ColdFusionMsSqlMysqlmariadboracleDB2mssql2008mssql2005SQLitePostgreSQLMongoDB星外虚拟主机华众虚拟主机Linuxwin服务器FTP服务器DNS服务器Tomcatnginxzabbix云和虚拟化bios系统安装系统系统进程Windows系列LINUXRedHat/CentosUbuntu/DebianFedoraSolaris红旗Linux建站经验微信营销网站优化网站策划网络赚钱网络创业站长故事alexa域名photoshop教程摄影教程Fireworks教程CorelDraw教程Illustrator教程Painter教程Freehand教程IndesignSketch笔记本主板内存CPU存储显卡显示器光存储鼠标键盘平板电脑安全教程杀毒防毒安全设置病毒查杀脚本攻防入侵防御工具使用业界动态Exploit漏洞分析
最新php教程教程
热门php教程教程