jquery.cookie.js用法实例详解


Posted in Javascript onDecember 25, 2015

本文实例讲述了jquery.cookie.js用法。分享给大家供大家参考,具体如下:

对cookies的操作在当访问一个网站就无时无刻的都伴随着我们,记录着我们的一举一动,并将不危害用户隐私的信息,将以保存,这样用户就不用去从新再次操作重复的步骤,这样大大方便了客户,也增加了客户对网站的回头率。

jquery.cookie.js 提供了jquery中非常简单的操作cookie的方法。

$.cookie('the_cookie'); // 获得cookie
$.cookie('the_cookie', 'the_value'); // 设置cookie
$.cookie('the_cookie', 'the_value', { expires: 7 }); //设置带时间的cookie
$.cookie('the_cookie', '', { expires: -1 }); // 删除
$.cookie('the_cookie', null); // 删除 cookie
$.cookie('the_cookie', 'the_value', {expires: 7, path: '/', domain: 'jquery.com', secure: true});//新建一个cookie 包括有效期 路径 域名等

这个插件默认的过期是按天数计算的,我们可以修改下,按毫秒计算,修改如下:

if (typeof options.expires === 'number') {
   //var days = options.expires, t = options.expires = new Date();
   //t.setDate(t.getDate() + days);
   var seconds = options.expires, t = options.expires = new Date();
   t.setTime(t.getTime() + seconds);
   //t.setTime(t.getTime() + days);
   //date.setTime(date.getTime() + (1 * 24 * 60 * 60 * 1000));
}

下面举个简单的例子:我们需要对某个页面进行阅读统计,但是呢,在一段时间里(比如5分钟),同一个人无论刷新了这个页面多少次都好,都只能算一次。这个时候可以借助cookie来实现:

<script language="javascript" src="/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/js/jquery.cookie.js"></script>
<script language="javascript" src="/js/jquery.jsonp-2.1.4.min.js"></script>
<script type="text/javascript">
 // 页面类型,标识一组页面
 var pageType = 20110420;
 // 页面id,标识唯一一个页面
 var url = window.location.href;
 var url_arr = url.split(".");
 var id = url_arr[url_arr.length - 2];
 //var id = 2;
 //var cookie = $.cookie('the_cookie'+id, true, { expires: 5/24/60/60 });
 $(document).ready(function(){
  init_count(pageType, id);
 })
 // 初始化数据,同一个cookie一分钟的访问量都算一次
 function init_count(pageType, id){
  if($.cookie('the_cookie'+id)){
   //alert("cookie已存在");
   getViewData(pageType, id);
  }
  else
  {
   // 1分钟过期
   var cookie = $.cookie('the_cookie'+id, 'Gonn', { expires: 1000 * 60 * 5 });
   //$.cookie('the_cookie'+id, 'Gonn');
   //var cookie = $.cookie('the_cookie'+id);
   //alert(cookie);
   insert_page(pageType, id);
  }
 }
 // 不插入与更新时统计访问量
 function getViewData(pageType, id){
  $.ajax({
   type: "get",  //使用get方法访问后台
   dataType: "jsonp", //返回json格式的数据
   jsonp:"callback",
   url: "/manage.php", //要访问的后台地址
   data:{"opp":"view", "pageType":pageType, "id":id},
   async: false,
   success: function(data){
    //alert(data.total);
    $('#pc_1').html(data.total);
    $('#pcm_1').html(data.record);
   }
  })
 }
 // 插入或者更新页面统计
 function insert_page(pageType, id){
  var j = null;
  $.ajax({
   type: "get",  //使用get方法访问后台
   dataType: "jsonp", //返回json格式的数据
   jsonp:"callback",
   url: "/manage.php", //要访问的后台地址
   data:{"opp":"insert", "pageType":pageType, "id":id},
   async: false,
   success: function(data){
    //alert(msg.current);
    //alert(msg.record);
    j = data;
    //alert("111");
    //alert(j.total);
    $('#pc_1').html(data.total);
    $('#pcm_1').html(data.record);
   }
  })
 }
</script>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
prototype class详解
Sep 07 Javascript
myeclipse安装jQuery插件的方法
Mar 29 Javascript
Jquery中Ajax 缓存带来的影响的解决方法
May 19 Javascript
js点击页面其它地方将某个显示的DIV隐藏
Jul 12 Javascript
JS字符串拼接在ie中都报错的解决方法
Mar 27 Javascript
JS实现仿雅虎首页快捷登录入口及导航模块效果
Sep 19 Javascript
javascript jquery对form元素的常见操作详解
Jun 12 Javascript
在vue项目创建的后初始化首次使用stylus安装方法分享
Jan 25 Javascript
浅谈Vuex注入Vue生命周期的过程
May 20 Javascript
小程序多图列表实现性能优化的方法步骤
May 28 Javascript
javascript中undefined的本质解析
Jul 31 Javascript
three.js显示中文字体与tween应用详析
Jan 04 Javascript
理解javascript中try...catch...finally
Dec 25 #Javascript
javascript实现简单加载随机色方块
Dec 25 #Javascript
学习JavaScript鼠标响应事件
Dec 25 #Javascript
理解javascript中DOM事件
Dec 25 #Javascript
理解JavaScript中worker事件api
Dec 25 #Javascript
基于jquery实现省市区三级联动效果
Dec 25 #Javascript
js实现文本框输入文字个数限制代码
Dec 25 #Javascript
You might like
用PHP动态生成虚拟现实VRML网页
2006/10/09 PHP
PHP+JS无限级可伸缩菜单详解(简单易懂)
2007/01/02 PHP
PHP如何编写易读的代码
2007/07/10 PHP
php中json_encode中文编码问题分析
2011/09/13 PHP
浅谈PHP表单提交(POST&amp;GET&amp;URL编/解码)
2017/04/03 PHP
关于ThinkPhp 框架表单验证及ajax验证问题
2017/07/19 PHP
PHP7原生MySQL数据库操作实现代码
2020/07/03 PHP
JavaScript 在各个浏览器中执行的耐性
2009/04/06 Javascript
jquery 倒计时效果实现秒杀思路
2013/09/11 Javascript
js获取时间(本周、本季度、本月..)
2013/11/22 Javascript
JS对象转换为Jquery对象示例
2014/01/26 Javascript
Javascript基础教程之数据类型 (数值 Number)
2015/01/18 Javascript
JS组件Bootstrap实现弹出框和提示框效果代码
2015/12/08 Javascript
javascript中this指向详解
2016/04/23 Javascript
iscroll-probe实现下拉刷新和下拉加载效果
2017/06/28 Javascript
通过vue-cli来学习修改Webpack多环境配置和发布问题
2017/12/22 Javascript
详解vue-cli 快速搭建单页应用之遇到的问题及解决办法
2018/03/01 Javascript
Vuex持久化插件(vuex-persistedstate)解决刷新数据消失的问题
2019/04/16 Javascript
Angular2使用SVG自定义图表(条形图、折线图)组件示例
2019/05/10 Javascript
JS简单数组排序操作示例【sort方法】
2019/05/17 Javascript
vue项目中使用particles实现粒子背景效果及遇到的坑(按钮没有点击响应)
2020/02/11 Javascript
Python3中的2to3转换工具使用示例
2015/06/12 Python
python机器学习之神经网络(二)
2017/12/20 Python
Python3.5.3下配置opencv3.2.0的操作方法
2018/04/02 Python
python卸载后再次安装遇到的问题解决
2019/07/10 Python
Python基于类路径字符串获取静态属性
2020/03/12 Python
资深生产主管自我评价
2013/09/22 职场文书
毕业生幼师求职自荐信
2013/10/01 职场文书
手术室护士自我鉴定
2013/10/14 职场文书
路政管理毕业自荐书范文
2014/02/10 职场文书
保研推荐信
2014/05/09 职场文书
小学数学课题方案
2014/06/15 职场文书
中学学校门卫岗位职责
2014/08/15 职场文书
群众路线学习心得体会范文
2014/11/05 职场文书
陕西导游词
2015/02/04 职场文书
分析SQL窗口函数之排名窗口函数
2022/04/21 Oracle