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 相关文章推荐
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
Mar 28 jQuery
jQuery插件FusionCharts绘制的3D双柱状图效果示例【附demo源码】
Apr 20 jQuery
node.js+jQuery实现用户登录注册AJAX交互
Apr 28 jQuery
jQuery表单设置值的方法
Jun 30 jQuery
原生JS与jQuery编写简单选项卡
Oct 30 jQuery
基于jQuery中ajax的相关方法汇总(必看篇)
Nov 08 jQuery
jquery如何实现点击空白处隐藏元素
Dec 05 jQuery
jQuery实现每隔一段时间自动更换样式的方法分析
May 03 jQuery
解决jquery的ajax调取后端数据成功却渲染失败的问题
Aug 08 jQuery
JS与jQuery判断文本框还剩多少字符可以输入的方法
Sep 01 jQuery
jquery实现动态创建form并提交的方法示例
May 27 jQuery
jQuery实现广告显示和隐藏动画
Jul 04 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通过sort()函数给数组排序的方法
2015/03/18 PHP
PHP实现微信红包金额拆分试玩的算法示例
2018/04/07 PHP
在服务端(Page.Write)调用自定义的JS方法详解
2013/08/09 Javascript
一个不错的字符串转码解码函数(自写)
2014/07/31 Javascript
javascript获取网页宽高方法汇总
2015/07/19 Javascript
深入理解JavaScript中的块级作用域、私有变量与模块模式
2016/10/31 Javascript
JQuery和HTML5 Canvas实现弹幕效果
2017/01/04 Javascript
Easyui ueditor 整合解决不能编辑的问题(推荐)
2017/06/25 Javascript
vue loadmore组件上拉加载更多功能示例代码
2017/07/19 Javascript
vue 2.0封装model组件的方法
2017/08/03 Javascript
AngularJS的$location使用方法详解
2017/10/19 Javascript
vue 组件中添加样式不生效的解决方法
2018/07/06 Javascript
node上的redis调用优化示例详解
2018/10/30 Javascript
electron中使用bootstrap的示例代码
2018/11/06 Javascript
深入理解vue-class-component源码阅读
2019/02/18 Javascript
JQuery实现简单的复选框树形结构图示例【附源码下载】
2019/07/16 jQuery
vue 实现单选框设置默认选中值
2019/11/07 Javascript
python多重继承新算法C3介绍
2014/09/28 Python
python爬取NUS-WIDE数据库图片
2016/10/05 Python
python实现解数独程序代码
2017/04/12 Python
在Django中输出matplotlib生成的图片方法
2018/05/24 Python
python中将\\uxxxx转换为Unicode字符串的方法
2018/09/06 Python
Python基础之文件读取的讲解
2019/02/16 Python
django模板加载静态文件的方法步骤
2019/03/01 Python
解决Python import docx出错DLL load failed的问题
2020/02/13 Python
解决keras加入lambda层时shape的问题
2020/06/11 Python
python反扒机制的5种解决方法
2021/02/06 Python
工作求职自荐信
2014/06/13 职场文书
银行奉献演讲稿
2014/09/16 职场文书
2015出纳试用期工作总结
2014/12/12 职场文书
2015年库房工作总结
2015/04/30 职场文书
大学升旗仪式主持词
2015/07/04 职场文书
2016情人节宣传语
2015/07/14 职场文书
一波干货,会议主持词开场白范文
2019/05/06 职场文书
Python数据类型最全知识总结
2021/05/31 Python
Python排序算法之插入排序及其优化方案详解
2021/06/11 Python