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 相关文章推荐
云网广告中的代码,提示出错,大家找找
Nov 21 Javascript
AngularJS使用ngOption实现下拉列表的实例代码
Jan 23 Javascript
jQuery Tags Input Plugin(添加/删除标签插件)详解
Jun 20 Javascript
浅谈jQuery双事件多重加载的问题
Oct 05 Javascript
基于JavaScript实现窗口拖动效果
Jan 18 Javascript
js实现文本上下来回滚动
Feb 03 Javascript
jQuery选择器之属性筛选选择器用法详解
Sep 19 jQuery
Vue 项目分环境打包的方法示例
Aug 03 Javascript
详解javascript中var与ES6规范中let、const区别与用法
Jan 11 Javascript
node.js使用yargs处理命令行参数操作示例
Feb 11 Javascript
js实现页面图片消除效果
Mar 24 Javascript
layui使用及简单的三级联动实现教程
Dec 01 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中PDO基础教程 入门级
2011/09/04 PHP
ThinkPHP框架实现数据增删改
2017/05/07 PHP
cookie丢失问题(认证失效) Authentication (用户验证信息)也会丢失
2009/06/04 Javascript
extjs 学习笔记(二) Ext.Element类
2009/10/13 Javascript
Flex通过JS获取客户端IP和计算机名的实例代码
2013/11/21 Javascript
浅谈javascript中自定义模版
2015/01/29 Javascript
javascript递归回溯法解八皇后问题
2015/04/22 Javascript
手机图片预览插件photoswipe.js使用总结
2016/08/25 Javascript
浅谈js数据类型判断与数组判断
2016/08/29 Javascript
微信小程序 网络API Websocket详解
2016/11/09 Javascript
为JQuery EasyUI 表单组件增加焦点切换功能的方法
2017/04/13 jQuery
jQuery中each循环的跳出和结束实例
2017/08/16 jQuery
Vue中引入样式文件的方法
2017/08/18 Javascript
浅析Vue 和微信小程序的区别、比较
2018/08/03 Javascript
利用JS代码自动删除稿件的普通弹幕功能
2019/09/20 Javascript
js+canvas实现刮刮奖功能
2020/09/13 Javascript
用pywin32实现windows模拟鼠标及键盘动作
2014/04/22 Python
Python中urllib+urllib2+cookielib模块编写爬虫实战
2016/01/20 Python
shelve  用来持久化任意的Python对象实例代码
2016/10/12 Python
python3如何将docx转换成pdf文件
2018/03/23 Python
python实现弹跳小球
2019/05/13 Python
Python Numpy 实现交换两行和两列的方法
2019/06/26 Python
python字符串替换re.sub()实例解析
2020/02/09 Python
python爬虫可以爬什么
2020/06/16 Python
Python 绘制可视化折线图
2020/07/22 Python
使用CSS变量实现炫酷惊人的悬浮效果
2019/04/26 HTML / CSS
阿迪达斯新加坡官方网站:adidas新加坡
2019/12/06 全球购物
解释一下Windows的消息机制
2014/01/30 面试题
护理专业学生的求职信范文
2013/12/11 职场文书
致裁判员加油稿
2014/02/08 职场文书
元旦获奖感言
2014/03/08 职场文书
委托书格式
2014/08/01 职场文书
党员群众路线教育实践活动学习笔记
2014/11/05 职场文书
台风停课通知
2015/04/24 职场文书
个人职业生涯规划之自我评估篇
2019/09/03 职场文书
星际争霸 Light vs Action 一场把教主看到鬼畜的比赛
2022/04/01 星际争霸