jQuery+PHP+Ajax实现的一款动态数字统计展示实例,本例是在页面上动态展示了当前在线用户数,当然了,你可以应用到其他更多场景中。

首先我们在#number放置要统计的数字:

当前在线:

然后我们要定义一个动画过程,使用jQuery的animate()函数实现从一个数字到另一个数字的变换过程,magic_number()自定义函数代码如下:

function magic_number(value) {

var num = $("#number");

num.animate({count: value}, {

duration: 500,

step: function() {

num.text(String(parseInt(this.count)));

}

});

};

然后update()函数使用了jQuery的$.get()向后台ajax.php发送了一个ajax请求,在得到PHP相应后,调用magic_number()展示最新的数字。为了能看到更好的效果,我们使用setInterval()每三秒执行一次。

function update() {

$.get("ajax.php",

function(data) {

magic_number(data);

});

}

setInterval(update, 3000);

update();

我们随机从0到999抽取一个数字,你可以从数据库表里读取:

echo mt_rand(0,999);

总结

以上所述是小编给大家介绍的jQuery+PHP+Ajax实现动态数字统计展示功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

ajax php 动态,jQuery+PHP+Ajax实现动态数字统计展示功能相关推荐

  1. ajax php计数,jQuery+PHP+Ajax动态数字统计展示实例

    jQuery+PHP+Ajax实现的一款动态数字统计展示实例,本例是在页面上动态展示了当前在线用户数,当然了,你可以应用到其他更多场景中. 首先我们在#number放置要统计的数字: 当前在线: - ...

  2. jQuery+PHP+Ajax动态数字统计展示实例

    jQuery+PHP+Ajax实现的一款动态数字统计展示实例,本例是在页面上动态展示了当前在线用户数,当然了,你可以应用到其他更多场景中. 首先我们在#number放置要统计的数字: <div ...

  3. jquery中ajax完整例子get,jq的ajax方法,jquery中ajax完整例子

    jq的ajax方法,jquery中ajax完整例子 相较与js异步对象的繁琐,jq的ajax对象结构更加清晰 一:ajax对象简述 ajax(Asynchronous JavaScript and X ...

  4. Ajax入门总结--jquery实现Ajax

    ajax(Asynchronous Javascript And XML):只刷新局部页面的技术 ajax的工作流程: 使用javascript获取到页面上的数据 通过Ajax引擎创建XMLHttpR ...

  5. java如何构造ajax回调参数,jQuery实现ajax回调函数带入参数的方法示例

    本文实例讲述了jQuery实现ajax回调函数带入参数的方法.分享给大家供大家参考,具体如下: 不带参数的写法: function pass(htmlId,auditingFlag){ var url ...

  6. jsp jquery ajax请求,JSP+jquery使用ajax方式调用json的实现方法

    本文实例讲述了JSP+jquery使用ajax方式调用json的实现方法.分享给大家供大家参考,具体如下: //test function test(uid) { if(confirm("确 ...

  7. 调用$.ajax不成功,jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法...

    jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...

  8. jquery ajax实例get,jQuery中ajax的get()方法用法实例

    本文实例讲述了jQuery中ajax的get()方法用法.分享给大家供大家参考.具体分析如下: $.get()通过 HTTP GET请求从服务器上请求数据. 语法结构: $.get(url, [dat ...

  9. ajax 随机,基于JQuery及AJAX实现名人名言随机生成器

    基于JQuery及AJAX实现名人名言随机生成器 发布于 2017-05-05 06:56:38 | 137 次阅读 | 评论: 0 | 来源: 网友投递 jQuery javascript框架jQu ...

最新文章

  1. 中关村开源创新大赛-达闼赛道如火如荼进行中
  2. BZOJ4475: [Jsoi2015]子集选取【找规律】【数学】
  3. 【译】Diving Into The Ethereum VM Part 2 — How I Learned To Start Worrying And Count The Storage Cost
  4. 互斥锁、条件变量、自旋锁、读写锁
  5. kaggle为什么总是难以拿到金牌
  6. 虫师python appium自动化测试书_基于python的Appium自动化测试的坑
  7. MySQL-02:“数据库”操作基本命令及权限笔记
  8. 机器学习资料第3版,助你继续成长!
  9. AI 改写《权力的游戏》结局,和编剧比谁更烂?
  10. bzoj5138 [Usaco2017 Dec]Push a Box
  11. Oracle-数据库
  12. 房屋出租系统(java)
  13. 微信小程序无法获取头像,昵称的解决办法 (原生)
  14. D3.jsV5入门教程
  15. 【IoT】基于 CC2530 的 ZigBee 物联网系统设计
  16. 自己动手写H3C校园网登录客户端(Linux平台版)
  17. Python-到底啥是面向对象&面向过程?
  18. 揭秘社会工程学(让你免于被诈骗的命运)
  19. 史上最全测试流程详解----超详细
  20. vue引入51la流量监控

热门文章

  1. C#使用Xamarin开发可移植移动应用(4.进阶篇MVVM双向绑定和命令绑定)附源码
  2. 用JWT来保护我们的ASP.NET Core Web API
  3. django21:admin后台管理\media配置\图片防盗链\暴露后端资源\路由分发\时间分类
  4. 将域名绑定到ip上,并实现访问不同二级子域名对应不同目录
  5. [转]IPython介绍
  6. 定量遥感:计算地方时和太阳高度角(C++代码)
  7. 剑指offer之二叉树的高度
  8. linux网络编程之sockaddr_in和in_addr区别
  9. Android之手机摇一摇震动刷新(支持ListView、GridView、WebView)并生成我的二维码
  10. java 常用类库_JAVA(三)JAVA常用类库/JAVA IO