jQuery+ThinkPHP+Ajax实现即时消息提醒功能实例代码


Posted in jQuery onMarch 21, 2017

心血来潮想为自己的小项目做一个提醒系统,譬如私信,评论等消息都能及时传递过来。由于道行尚浅,网上那些长轮询对于我略微复杂,于是觉得还是自己写一写试试比较好。

我的思路是,单独在数据库中建一个提醒表,表主要由接收者的id和消息类型两个字段组成

/* 前台提醒表 */
CREATE TABLE IF NOT EXISTS notification(
  id      INT NOT NULL AUTO_INCREMENT PRIMARY KEY,  --  主键自增
  mid     INT NOT NULL DEFAULT 0,            --  用户id
  type    INT NOT NULL DEFAULT 0            -- 0:私信 1:帖子评论 2:商品售出 3:商品评论 4:小组申请已发送 5:小组创建成功 6:小组新成员加入 7:小组旧成员退出 8:活动邀请
)ENGINE=MyISAM DEFAULT CHARSET=UTF8;

然后在前台页面中写一个递归函数,用来请求Ajax。

function require() {
   var url = "{U('Group/checkNotify')}";
    
   $.get(url,null,function(data) {
    



      // 如果获得的数据不为空,则显示提醒
      if ($.trim(data) != '') {
        // 这里写提醒的方式
    

alert('haha');
      }
   });
   // 每三秒请求一次
   setTimeout('require()',3000);
}

在后台查询三秒前到当前时刻数据库中是否有数据插入,如果有,则返回所需要的信息

public function checkNotify() {
  // 实例化自定义的模型类
  $Notify = D("Notification");
  // 获取当前用户的id
  $mid = $_SESSION['member']['id'];
  // 由于Ajax三秒钟才执行一次,所以新数据的插入时间要晚于查询的的请求时间(当前时间)三秒钟
  $time = time() - 3;
  // 准备查询条件
  $where = "mid = $mid and created>$time";
   // 查找数据库中是否有新数据插入
  $bool = $Notify->where($where)->find();
  // 如果查询结果非空,则输出结果集第零条数据的type参数,即提醒类型,然后再从数据库对应表中获取提醒内容
  //本测试默认3秒中内只有一条消息,如果想更加精确,也可以缩短请求时间
  if ($bool != null) {
    //测试数据     
    echo $bool[0]['type'];
  };
}

当然,要让文档载入完毕后就执行该函数

<body onload="javascript:return require();">

以上所述是小编给大家介绍的jQuery+ThinkPHP+Ajax实现即时消息提醒功能实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
JS/jquery实现一个网页内同时调用多个倒计时的方法
Apr 27 jQuery
jQuery validata插件实现方法
Jun 25 jQuery
jQuery实现的手动拖动控制进度条效果示例【测试可用】
Apr 18 jQuery
AJAX在JQuery中的应用详解
Jan 30 jQuery
jquery 验证用户名是否重复代码实例
May 14 jQuery
jQuery实现html可联动的百分比进度条
Mar 26 jQuery
jquery绑定事件 bind和on的用法与区别分析
May 22 jQuery
Jquery高级应用Deferred对象原理及使用实例
May 28 jQuery
jQuery实现飞机大战小游戏
Jul 05 jQuery
jquery实现简单自动轮播图效果
Jul 29 jQuery
jQuery实现本地存储
Dec 22 jQuery
html中两种获取标签内的值的方法
Jun 16 jQuery
jquery插件制作 自增长输入框实现代码
Aug 17 #jQuery
使用jQuery监听扫码枪输入并禁止手动输入的实现方法(推荐)
Mar 21 #jQuery
jQuery插件HighCharts绘制2D饼图效果示例【附demo源码下载】
Mar 21 #jQuery
jQuery插件HighCharts绘制简单2D折线图效果示例【附demo源码】
Mar 21 #jQuery
jQuery插件HighCharts绘制简单2D柱状图效果示例【附demo源码】
Mar 21 #jQuery
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
Mar 22 #jQuery
jQuery轻松实现无缝轮播效果
Mar 22 #jQuery
You might like
php查看session内容的函数
2008/08/27 PHP
php array_unique之后json_encode需要注意
2011/01/02 PHP
php入门学习知识点三 PHP上传
2011/07/14 PHP
PHP+MYSQL会员系统的开发实例教程
2014/08/23 PHP
google 搜索框添加关键字实现代码
2010/04/24 Javascript
浏览器常用高宽的jquery插件
2011/02/24 Javascript
jquery中实现标签切换效果的代码
2011/03/01 Javascript
showModalDialog模态对话框的使用详解以及浏览器兼容
2014/01/11 Javascript
node.js实现多图片上传实例
2014/06/03 Javascript
解决js下referer兼容各大浏览器的方法
2014/11/03 Javascript
深入理解JavaScript系列(39):设计模式之适配器模式详解
2015/03/04 Javascript
详解javascript遍历方式
2015/11/11 Javascript
谈谈JavaScript类型系统之Math
2016/01/06 Javascript
AngularJS身份验证的方法
2016/02/17 Javascript
jQuery插件Validation快速完成表单验证的方式
2016/07/28 Javascript
jQuery实现页面顶部下拉广告
2016/12/30 Javascript
JavaScript Date 知识浅析
2017/01/29 Javascript
最常见和最有用的字符串相关的方法详解
2017/02/06 Javascript
js代码延迟一定时间后执行一个函数的实例
2017/02/15 Javascript
vue.js或js实现中文A-Z排序的方法
2018/03/08 Javascript
vue中$refs, $emit, $on, $once, $off的使用详解
2019/05/26 Javascript
mpvue实现左侧导航与右侧内容的联动
2019/10/21 Javascript
Vue的双向数据绑定实现原理解析
2020/02/17 Javascript
python实现在windows服务中新建进程的方法
2015/06/30 Python
在Python程序中操作MySQL的基本方法
2015/07/29 Python
Python面向对象编程基础解析(二)
2017/10/26 Python
python高级特性和高阶函数及使用详解
2018/10/17 Python
python实现最短路径的实例方法
2020/07/19 Python
CSS3 边框效果
2019/11/04 HTML / CSS
瑞典手机壳品牌:Richmond & Finch
2018/04/28 全球购物
在使用非全零作为空指针内部表达的机器上, NULL是如何定义
2014/11/09 面试题
物流管理专业大学生自荐信
2013/10/04 职场文书
暑期社会实践学生的自我评价
2014/01/09 职场文书
优秀党员先进事迹材料
2014/12/18 职场文书
小学生光盘行动倡议书
2015/04/28 职场文书
nginx之内存池的实现
2022/06/28 Servers