针对jquery中cookie用法的实例详解,请参考以下内容。
针对jquery中cookie用法的实例详解,请参考以下内容。
1. 引入jquery.cookie插件
在使用jquery.cookie插件前,需要先将该插件引入到HTML文件中。可以通过CDN引入,也可以将该插件下载到本地后再引入。
<!--通过CDN引入jquery和jquery.cookie插件-->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
2. 存储cookie
在jquery中,可以通过$.cookie()函数来存储cookie。
//存储cookie,expiry为过期时间
$.cookie('name', 'value', {expires: expiry});
//示例
$.cookie('username', 'jack', {expires: 7}); //expires为7天后过期
在上面的示例中,存储了一个名为“username”的cookie,值为“jack”,过期时间为7天后。
3. 获取cookie
通过$.cookie()函数也可以获取已经存储的cookie。
//获取cookie,如果不存在则返回undefined
$.cookie('name');
//示例
var userName = $.cookie('username');
if(userName !== undefined){
console.log('欢迎' + userName + '登录');
}
在上面的示例中,通过$.cookie('username')获取存储的cookie“username”的值,并输出欢迎语。
4. 删除cookie
通过$.removeCookie()函数可以删除指定的cookie。
//删除cookie
$.removeCookie('name', {path: '/'});
//示例
$.removeCookie('username'); //删除名为“username”的cookie
在上面的示例中,通过$.removeCookie('username')删除名为“username”的cookie。
5. 示例
以下是一个完整的示例,展示如何存储、获取和删除cookie。
//存储名为“username”的cookie,值为“jack”,过期时间为7天后
$.cookie('username', 'jack', {expires: 7});
//获取名为“username”的cookie的值
var userName = $.cookie('username');
if(userName !== undefined){
console.log('欢迎' + userName + '登录');
}
//删除名为“username”的cookie
$.removeCookie('username');
在上面的示例中,通过$.cookie()函数存储了名为“username”的cookie,并设置了过期时间为7天后。然后通过$.cookie()函数获取了该cookie的值,并输出欢迎语。最后通过$.removeCookie()函数删除了该cookie。
以上就是jquery中cookie用法实例的详细攻略,希望您能有所收获。
本文标题为:jquery中cookie用法实例详解(获取,存储,删除等)
基础教程推荐
- 基于@vue-cli3的多页面应用改造及nignx配置 2023-10-08
- CSS教程之div垂直居中的多种方法 2023-12-09
- 深入探究JavaScript中WeakMap的原理与用法 2023-07-09
- vue中同步方法的实现 2023-07-10
- ajax上传图片到PHP并压缩图片显示的方法 2023-02-14
- FormData+Ajax实现上传进度监控 2023-02-14
- 详解解决flex布局的justify-content: space-between对齐方式的一个BUG的两种方法 2024-01-08
- layui数据表格监听按钮问题 2022-12-16
- 如何实现美观的页面边框——CSS border详解 2023-10-08
- ajax分页查询详解 2023-01-31
