做过web开发的小伙伴对于Cookie一定不陌生，当用户登录后将用户的账号保存到本地，密码保存时，建议使用MD5进行加密，以防止用户个人信息的泄露。今天和大家简单聊聊关于Jquer Cookie的使用，一便我们接下来的开发中使用更方便。好了下面我们开始今天今天的内容：操作Cookie无非是存、取、删，下面就一起简单学一下jQuery Cookie的使用。

　　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 包括有效期 路径 域名等

　　相信一些小伙伴已经急不耐了，鼠标右键创建文件夹，导入下载好相应的js文件，打开记事本，编写我们的测试页面，ok，写好了，打开，发现浏览器并没有保存Cookie中的值，然后检查js文件是否引用正确，各种一阵盲测，发现什么也没写错，开始怀疑人生了。上面就是小编做过的蠢事，但是这是为什么呢？首先写的没错，错就错在肯定是在本地测试的，cookie是基于域名来储存的。意思您要把它放到测试服务器上或者本地localhost服务器上才会生效。cookie具有不同域名下储存不可共享的特性。单纯的本地一个html页面打开是无效的。是不是很无奈，那就按照上面的逻辑走一下，创建一个java web，然后把我们的代码拷进去，部署到Tomcat上，通过浏览器测试，问题解决了。

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <base href="<%=basePath%>">

    <title>Cookie测试</title>

    <meta http-equiv="pragma" content="no-cache">

    <meta http-equiv="cache-control" content="no-cache">

    <meta http-equiv="expires" content="0">

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="This is my page">

    <script src="jquery-1.10.2.min.js" ></script>

    <script src="jquery.cookie.js" ></script>

  </head>

  <body>

    <input type="text" name="name" id="name" /><br/>

    <input type="password" name="password" id="password" /><br/>

    <input type="submit" class="submit" value="保存（随浏览器的生命周期）" /> | <input type="submit" class="submit" value="获取" /> | <input type="submit" class="submit" value="保存（设置生命周期）" /> | <input type="submit" class="submit" value="删除1" /> | <input type="submit" class="submit" value="删除2" /> | <input type="submit" class="submit" value="新建一个cookie 包括有效期 路径 域名"/>

    <script>

        $(".submit").bind("click", function(){

            var index = $(this).index();

            if(4 == index){

                $.cookie("password", $("#password").val());//生命周期：创建到浏览器关闭

            }else if(5 == index){

                alert($.cookie("password"));//获得Cookie中的值

            }else if(6 == index){

                $.cookie("password", $("#password").val(), { expires: 7 }); //设置带时间的cookie，当前设置Cookie的生命周期是一周

            }else if(7 == index){

                $.cookie('password', '', { expires: -1 }); // 删除

            }else if(8 == index){

                $.cookie('password', null); // 删除 cookie

            }else if(9 == index){

                $.cookie('password', $("#password").val(), {expires: 7, path: '/', domain: 'http://localhost:8080/', secure: true});//新建一个cookie 包括有效期 路径 域名等

            }

        });

    </script>

  </body>

</html>

　　最后附上jquery和jquery Cookie的下载地址：jquery（http://jquery.com/download/）、jquery Cookie（http://plugins.jquery.com/cookie/）

web开发之Cookie使用的更多相关文章

  1. Web开发之Cookie and Session

    会话 什么是会话? 简单说:用户开一个浏览器,点击多个超链接,访问服务器的多个web资源,然后关闭浏览器,整个过程就称之为一个会话. 会话过程要解决什么问题 每个用户在使用浏览器与服务器进行会话的过程 ...

  2. Vim下的Web开发之html,CSS,javascript插件

    Vim下的Web开发之html,CSS,javascript插件   HTML 下载HTML.zip 解压HTML.zip,然后将里面的所有文件copy到C:\Program Files\Vim\vi ...

  3. Web开发之Tomcat&Servlet

    <!doctype html>01 - JavaEE - Tomcat&Servlet figure:first-child { margin-top: -20px; } #wri ...

  4. 移动web开发之rem适配布局

    移动web开发之rem适配布局 方案: 页面布局文字能否随着屏幕大小变化而变化 流式布局和flex布局主要针对于宽度布局,那高度如何布局? 怎样让屏幕发生变化的时候元素高度和宽度等比例缩放? 1. r ...

  5. .NET Web开发之.NET MVC框架

    摘要:MVC是一种架构设计模式,该模式主要应用于图形化用户界面(GUI)应用程序.那么什么是MVC?MVC由三部分组成:Model(模型).View(视图)及Controller(控制器). MVC概 ...

  6. Python Web开发之Flask

    PythonWEB框架之Flask 前言: Django:1个重武器,包含了web开发中常用的功能.组件的框架:(ORM.Session.Form.Admin.分页.中间件.信号.缓存.ContenT ...

  7. HTML5+JS手机web开发之jQuery Mobile初涉

    一.起始之语 我一直都是在PC上折腾网页的,这会儿怎么风向周边捣鼓起手机网页开发呢?原因是公司原先使用Java开发的产品,耗了不少人力财力,但是最后的效果却不怎么好.因为,Android系统一套东西, ...

  8. Web 开发之 HTTP/2 & SPDY & HTTP 1.1 & HTTP 对比分析详解！

    1 https://zh.wikipedia.org/wiki/HTTP/2 HTTP/2 维基百科,自由的百科全书                         HTTP/2(超文本传输协议第2版 ...

  9. Web开发之response

    Web服务器收到客户端的http请求,会针对每一次请求,分别创建一个用于代表请求的request对象.和代表响应的response对象. 我们要获取客户机提交过来的数据,只需要找request对象就行 ...

随机推荐

  1. unity3d 获取游戏对象详解

    原文地址:http://www.xuanyusong.com/archives/2768 我觉得Unity里面的Transform 和 GameObject就像两个双胞胎兄弟一样,这俩哥们很要好,我能 ...

  2. vi编辑器的使用方式

    vi编辑器是所有Unix及Linux系统下标准的编辑器,它的强大不逊色于任何最新的文本编辑器,这里只是简单地介绍一下它的用法和一小部分指令.由于对Unix及Linux系统的任何版本,vi编辑器是完全相 ...

  3. 限制 Text Field 输入的内容类型：只允许输入数字

    效果如下: ViewController.h #import <UIKit/UIKit.h> @interface ViewController : UIViewController< ...

  4. 基于.NET平台常用的框架

    分布式缓存框架: Microsoft Velocity:微软自家分布式缓存服务框架. Memcahed:一套分布式的高速缓存系统,目前被许多网站使用以提升网站的访问速度. Redis:是一个高性能的K ...

  5. 【QT】Cannot find file: untitled.pro，项目路径不要包含中文。

    Cannot find file: D:\文件及下载相关\文档\untitled\untitled.pro. 17:01:45: 进程"D:\Englishpath\QT5.9.3\5.9. ...

  6. Go 文件操作（创建、打开、读、写）

    https://blog.csdn.net/Tovids/article/details/77887946

  7. redis sentinels哨兵集群环境配置

    # Redis configuration file example. # # Note that in order to read the configuration file, Redis mus ...

  8. ab压测札记（Apache Bench）

    1 ab安装 ab实际上是apache httpd里面的一个工具或者说子模块,安装apache httpd可以参考另一篇文章JBOSS集群的2.3节 安装目录:/apache目录/bin/,如下 2 ...

  9. 5 -- Hibernate的基本用法 --4 8 外连接抓取属性

    外连接抓取能限制执行SQL语句的次数来提高效率,这种外连接抓取通过在单个select语句中使用outer join来一次抓取多个数据表的数据. 外连接抓取允许在单个select语句中,通过@ManyT ...

  10. linux-nohup后台运行

    先说一下linux重定向: 0.1和2分别表示标准输入.标准输出和标准错误信息输出,可以用来指定需要重定向的标准输入或输出. 在一般使用时,默认的是标准输出,既1.当我们需要特殊用途时,可以使用其他标 ...