jquery.cookie的使用
2015-08-05 17:25
232 查看
今天想到了要为自己的影像日记增加赞的功能,并且需要用到cookie。
记得原生的js操作cookie也不是很麻烦的,但似乎jquery更简单,不过相比原生js,需要额外引入2个文件,似乎又不是很好,但既然你的项目是基于jquery的,那用jquery.cookie还是不错的。
jquery.cookie的项目地址:jquery-cookie
readme.md中也介绍了用法。简单介绍一下后,下面我们结合实例来用:
增:$.cookie(‘isZan’, ‘1’, { expires: 1, path:’/’});
数字1表示设置有效期为1天,path:’/’表示当前域名的根目录,例如www.baidu.com,这样设置以后cookie值就可以通用。
删:\$.cookie(‘isZan’, null);或者 \$.removeCookie(‘isZan’);
其它相关参数:
secure: true
默认值:false。如果为true,cookie的传输需要使用安全协议(HTTPS)。
raw: true
默认值:false。
默认情况下,读取和写入 cookie 的时候自动进行编码和解码(使用encodeURIComponent 编码,
decodeURIComponent 解码)。要关闭这个功能设置 raw: true 即可。
详细请参考官方,还有这篇:jquery.cookie 使用方法
【实例】我想点击设置cookie,点击删除则删除该cookie。页面图:
![](http://ymblog.net/wp-content/uploads/2015/08/1684.png)
那么我们的html代码是:
js代码
当点击以后,查看cookie
![](http://ymblog.net/wp-content/uploads/2015/08/000-288x300.png)
点击删除,
![](http://ymblog.net/wp-content/uploads/2015/08/222-300x271.png)
但如果你是用的
那么它的值被设置为了null
![](http://ymblog.net/wp-content/uploads/2015/08/111-300x259.png)
原文地址:jquery.cookie的使用
记得原生的js操作cookie也不是很麻烦的,但似乎jquery更简单,不过相比原生js,需要额外引入2个文件,似乎又不是很好,但既然你的项目是基于jquery的,那用jquery.cookie还是不错的。
jquery.cookie的项目地址:jquery-cookie
readme.md中也介绍了用法。简单介绍一下后,下面我们结合实例来用:
增:$.cookie(‘isZan’, ‘1’, { expires: 1, path:’/’});
数字1表示设置有效期为1天,path:’/’表示当前域名的根目录,例如www.baidu.com,这样设置以后cookie值就可以通用。
删:\$.cookie(‘isZan’, null);或者 \$.removeCookie(‘isZan’);
其它相关参数:
secure: true
默认值:false。如果为true,cookie的传输需要使用安全协议(HTTPS)。
raw: true
默认值:false。
默认情况下,读取和写入 cookie 的时候自动进行编码和解码(使用encodeURIComponent 编码,
decodeURIComponent 解码)。要关闭这个功能设置 raw: true 即可。
详细请参考官方,还有这篇:jquery.cookie 使用方法
【实例】我想点击设置cookie,点击删除则删除该cookie。页面图:
![](http://ymblog.net/wp-content/uploads/2015/08/1684.png)
那么我们的html代码是:
<body> <a href="#" class="zan">点赞</a> <a href="#" class="del">删除cookie</a> <script src="http://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script> <script src="jquery.cookie.js"></script> </body>
js代码
$(function(){ $('.zan').click(function(){ //先判断cookie是否等于我们设置的 // 如果不等于,就发送加1的请求 if($.cookie('isZan') == undefined){ $.post('add.php',{id:"1"}, function(data){ if(data == "ok"){ //如果数据库写入加1成功则,添加cookie缓存 $.cookie('isZan', '1', { expires: 1 }); } }); } // 如果存在则不加1,弹出提示 else{ alert("今天已经赞过一次了,感谢你!"); } }); //删除cookie $('.del').click(function(){ if($.cookie('isZan') != undefined){ // $.cookie('isZan', null); $.removeCookie('isZan'); alert("你的cookie值已成功删除!"); } }); });
当点击以后,查看cookie
![](http://ymblog.net/wp-content/uploads/2015/08/000-288x300.png)
点击删除,
![](http://ymblog.net/wp-content/uploads/2015/08/222-300x271.png)
但如果你是用的
$.cookie('isZan', null);
那么它的值被设置为了null
![](http://ymblog.net/wp-content/uploads/2015/08/111-300x259.png)
原文地址:jquery.cookie的使用
相关文章推荐
- jquery获取复选框checkbox的值
- 锋利的JQuery 学习笔记
- JQuery悬停控制图片轮播――代码简单
- 【jquery】jQuery Validate验证框架详解
- 判断checkbox是否选中并获取值
- JQuery 选择器、过滤器介绍
- jQuery uploadify在谷歌和火狐浏览器上传失败的解决方案
- jquery_pagination分页
- 关于JQuery加载本地JSON文件无法读取(权限不足的)解决
- jquery ajax asp.net
- JQuery Ajax 在asp.net中使用总结
- 网站新手引导(js+jquery)
- jquery选中checkbox的问题
- Jquery dialog属性
- jQuery实现checkbox全选 全不选
- jquery EasyUI 心得--------环境搭建
- jQuery中each的break和continue
- jQuery跟随鼠标方向出现遮罩层
- jQuery京东分类导航菜单
- javascript jQuery css常用不走弯路