jQuery-cookie插件的使用

什么是插件？

基于jQuery的语法，按照一定规范书写，具有特定功能的脚本文件，称为插件。

插件除了js文件之外，有的还包含css文件，图片和字体等资源文件。

在jQuery的官网https://jquery.com/搜索和下载需要的插件。

1.引入cookie插件

    <head>

        <meta charset="utf-8">

        <title>cookie插件的使用</title>

        <!-- 首先引入jQuery -->

        <script src="js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>

        <!-- 插件基于jQuery，然后再引入下载的cookie插件 -->

        <script src="../js/cookie/jquery.cookie.js" type="text/javascript" charset="utf-8"></script>

    </head>

cookie是什么？

cookie就是浏览器存储在用户电脑上的一小段文本文件。一个web页面或服务器会告知浏览器按照一定规范来存储这些信息，并在之后的请求中将这些信息发送至服务器。web服务器就可以使用这些信息来识别不同的用户。例如，访问一个网站输入账号密码，如保存密码则在cookie的有效期内再次访问网站时不会再输入账号密码。

2.创建cookie

在jQuery的官网，下载插件的页面都会有相应的使用文档。

        <script type="text/javascript">

            function doAdd(){

                //cookie的名字的属性

                $.cookie("username",$("#userName").val());//未指定过期时间，则会在关闭浏览器或过期。

                $.cookie("password",$("#passWord").val(),{expires:7});//指定有效期,7代表的是7天

            }

        </script>

设置输入框和按钮框并绑定。

    <body>

        用户名:<input type="text" name="" id="userName" value="" />

        密码:<input type="password" name="" id="passWord" value="" />

        <hr >

        <input type="button" name="" id="" value="添加cookie" onclick="doAdd()" />

    </body>

当在input中输入用户名密码后点击按钮调用doAdd函数

3.读取cookie

            //读取cookie

            function doRead(){

                //读取指定名字的cookies

                console.log($.cookie("username"));//直接调用cookie方法获取名字

            }

读取所有cokkie,需要使用each()方法遍历

        <script type="text/javascript">

            function doAdd(){

                //cookie的名字的属性

                $.cookie("username",$("#userName").val());//未指定过期时间，则会在关闭浏览器或过期。

                $.cookie("password",$("#passWord").val(),{expires:7});//指定有效期,7代表的是7天

            }

            //读取cookie

            function doRead(){

                //读取所有cookie

                var cookies = $.cookie();

                $.each(cookies,function(key,value){

                    console.log(key+ "=" +value);

                });

            }

        </script>

设置按钮并绑定

        <input type="button" name="" id="" value="读取cookie" onclick="doRead()"/>

在控制台输出

4.删除cookie

和读取类似

        <script type="text/javascript">

            //删除

            function removeDel(){

                $.removeCookie("username");

            }

        </script>

调用方法获取到想要删除的cookie名字

设置按钮并绑定

        <input type="button" name="" id="" value="删除cookie" onclick="removeDel()"/>

这里删除了username

Cookie插件的使用的更多相关文章

  1. jquery插件的用法之cookie 插件

    一．使用cookie 插件 插件官方网站下载地址:http://plugins.jquery.com/cookie/ cookie 插件的用法比较简单,直接粘贴下面代码示例: //生成一个cookie ...

  2. 为什么目前没有"成熟"的cookie插件？

    一.序言 最近真是挺忙的啊,导致也挺久没有时间来看看园中各位大神的文章,只能感慨业务真尼玛的多,所以在此写下一篇文章来大话最近工作和学习上面的一点点收获体会,希望大家能够有所收获,这篇文章虽然说是一篇 ...

  3. jQuery插件之Cookie插件使用方法~

    一.介绍 1-1.jQuery.Cookie.js插件是一个轻量级的Cookie管理插件.下载地址:jQuery-cookie.js  有需要的朋友,右键另存为即可! 二.使用方法 2-1.引入jQu ...

  4. jQuery：cookie插件的使用

    Jquery插件就是在Jquery基础之上,开发的基于Jquery的javascript库. 在Jquery中,引入cookie插件后,可以很方便的定义某个cookie的名称,并设置cookie值.通 ...

  5. jQuery之换肤与cookie插件

    有时候一个网页可以有多个皮肤进行选择,也就是不同的背景,或是一整套新的css,能使整个页面变成另一种风格. 这个功能可以用jQuery来实现.外加cookie插件.有了cookie,就可以长时间的保存 ...

  6. jQuery cookie插件保存用户登陆信息

    通过jquery cookie插件保存用户登录信息. 代码: <html>  <head>  <title>cookies.html</title>  ...

  7. 20151224jquery学习笔记---cookie插件

    hello,祝自己平安夜快乐. Cookie 是网站用来在客户端保存识别用户的一种小文件.一般来用库可以保存用户登录信息.购物数据信息等一系列微小信息.一． 使用 cookie 插件官方网站: htt ...

  8. jquery cookie插件

    jquery-cookie下载地址:http://www.bootcdn.cn/jquery-cookie/ 使用方法: 1.引入jQuery.Cookie.js插件. <script src= ...

  9. 知问前端——cookie插件

    Cookie是网站用来在客户端保存识别用户的一种小文件.一般可以保存用户登录信息.购物数据信息等一系列微小信息. 一.使用cookie插件 官方网站:http://plugins.jquery.com ...

  10. 第一百八十七节，jQuery，知问前端--cookie 插件，注册成功后生成cookie，显示登录状态

    jQuery,知问前端--cookie 插件 学习要点: 1.使用 cookie 插件 2.注册直接登录 Cookie 是网站用来在客户端保存识别用户的一种小文件.一般来用库可以保存用户登 录信息.购 ...

随机推荐

  1. 关于Python的随机数模块，你必须要掌握！

    所谓七夕 前几天的文章这个七夕节,用Python为女友绘制一张爱心照片墙吧!收获了最近以来最高的浏览量,没枉费我熬到夜里3点赶出来的热点文章.有付出就总会有所回报,只是看这天来的早晚而已.七夕一个人看 ...

  2. 工作流Activity组件值数据传递获取问题

    如图:先简单说一下大致过程 通过具体的菜单节点,加载具体的指令组件.本着低耦合的原件,需要将核查组件从指令组件重拆分出来,作为单独的组件根据业务需要拖拽到指令组件中.但是具体业务方面核查组件一方面需要 ...

  3. 如何在Android手机上进行自动化测试（上）

    版权声明:允许转载,但转载必须保留原链接:请勿用作商业或者非法用途 前言 通过阅读本节教程,你将了解到以下内容: 如何在脚本代码中.运行脚本时指定手机 如何填写--device Android:/// ...

  4. 一道随机函数题：由rand5()生成rand7()

    题目:已知rand5()函数能随机等概率的生成0, 1, 2, 3, 4,利用rand5()函数编写一个rand7()函数实现相似的功能. 分析:其实就是利用rand5()组合成一个更大范围的数,之后 ...

  5. 详解TCP连接的“三次握手”与“四次挥手”(上)

    一.TCP connection 客户端与服务器之间数据的发送和返回的过程当中需要创建一个叫TCP connection的东西: 由于TCP不存在连接的概念,只存在请求和响应,请求和响应都是数据包,它 ...

  6. Mysql的查询语句的使用

    1. 简单查询 查询所有字段: SELECT * FROM 表名 查询特定字段: SELECT 字段列表 FROM 表名 2. 查询显示行号 - 在字段列表中加入(@rownum := @rownum ...

  7. syslog日志

    Syslog协议 系统日志(Syslog)协议是在一个IP网络中转发系统日志信息的标准,它是在美国加州大学伯克利软件分布研究中心(BSD)的TCP/IP系统实施中开发的,目前已成为工业标准协议,可用它 ...

  8. Windows环境下XAMPP的相关设置

    WINDOWS环境下多域名多端口配置:https://www.cnblogs.com/c-and-unity/p/4539348.html

  9. NIM游戏，NIM游戏变形，威佐夫博弈以及巴什博奕总结

    NIM游戏,NIM游戏变形,威佐夫博弈以及巴什博奕总结 经典NIM游戏: 一共有N堆石子,编号1..n,第i堆中有个a[i]个石子. 每一次操作Alice和Bob可以从任意一堆石子中取出任意数量的石子 ...

  10. 基于MIG IP核的DDR3控制器（一）

    最近学习了DDR3控制器的使用,也用着DDR完成了一些简单工作,想着以后一段可能只用封装过后的IP核,可能会忘记DDR3控制器的一些内容,想着把这个DDR控制器的编写过程记录下来,便于我自己以后查看吧 ...