Ajax自动局部刷新

ajax实现无刷新更新前台数据 - 数据发生改变，前台自动更新

 <!DOCTYPE html>
 <html>
 <head>
     <title>Ajax自动局部刷新</title>
     <meta charset="utf-8">
     <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
 </head>
 <body>

     <p>姓名是：<span id="name"></span></p>
     <p>年龄是：<span id="age"></span></p>
 
     <script type="text/javascript">

         function getage(){
             //参数1:发送请求的URL地址(string类型)
             //参数2:要发送给服务器的数据(键值对方式,没有就为空)
             //参数3:回调函数
             $.post('/1.json',{},function(res){
             $('#name').html(res.name);//内容显示到id为name的标签上
             $('#age').html(res.age);

         })
         }

         $(function(){
             //使用定时器每秒发送一次ajax请求 1000毫秒 = 1秒
             $timeID = setInterval('getage()', 1000); //返回值是这个定时器的id标识，清除定时器使用
         })
    
     </script>
 </body>
 </html>

 

posted @ 2021-01-27 14:38  华北业余选手  阅读(41)  评论(0)    收藏  举报