《JQuery cookie》插件

cookie是保存在浏览器上的内容,用户在这次浏览页面的时候向
cookie中保存文本内容。下次再访问页面的时侯就可以取出来上
次保存的内容。这样可以得到上次“记忆”的内容,cookie不是jquery
特有的概念,只不过jquery cookie把他简化的更好用而已
cookie 需要浏览器的支持,浏览器的cookie是可以禁用的,如果禁用了
cookie就不能使用了。不过一般不用考虑禁用cookie的情况。
cookie 的几个特征:
cookie是与域名相关的,所以163.com不能读取baidu.com记录的cookie
正因为如此读取,设置cookie的时候不用担心不同域名cookie的冲突:
一个域名能写入的cookie总尺寸是有限制的,一般是几千个字节,能写入
的Cookie总条数一般是几十条,超过以后浏览器自己会根据自己的策略
移除一些Cookie;Cookie不是写入以后一定下次能读出来。浏览器可能会定期
会清除,用户也可能会手动清除
$.cookie("键值")取值
$.cookie("键名","键值")设值
$.cookie("用户名", "tom", {expires:7,domain:'itcast.cn',secure:true});
{expires:8}表示能够保存几天,属于给浏览器的建议

 <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/jquery.cookie.js"></script>
<link href="js/jquery-ui.min.css" rel="stylesheet" />
<script type="text/javascript">
$(function () {
$("#dialog").dialog();
$("#dialog1").accordion();
$("#dialog2").tabs();
}) </script>
</head>
<body>
<div id="dialog">你好,我是一个对话框!黑河,我爱你</div>
<div id="dialog1">你好,我是一个对话框!黑河,我爱你</div>
<div id="dialog2">
<ul>
<li><a href="#tbbase">基本设置</a></li>
<li><a href="#tbadv">高级设置</a></li>
</ul>
<ul id="tbbase">
<li><a href="#">用户名</a></li>
<li><a href="#">刷新频率</a></li>
</ul>
<div id="tbadv">
<label for="username">用户名:</label><input type="text" id="username"/><br/>
<label for="password">登陆密码:</label><input type="text" id="password"/>
</div>
</div> </body>
</html>
 <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>preventDefault()案例</title>
<style type="text/css">
.qqhead{
font-size:30px;
color:deepskyblue;
background-color:red;
cursor:pointer;
width:30%;
}
.content {
font-size: 20px;
color: blue;
border-style: solid;
width: 30%;
}
ul{list-style-type:none;}
</style>
<!--加载文件-->
<script src="js/jquery-1.11.1.min.js" type="text/javascript"></script>
<script src="js/jquery.cookie.js"type="text/javascript"></script>
<script src="js/jquery-ui.min.js"></script> <script type="text/javascript">
$(function () {
$("#ul1 li:even").addClass("qqhead").click(function () { $(this).next("li.content").toggle().siblings("li.content").hide()});
$("#ul1 li:odd").addClass("content").click();
$("#ul1 > li:first").click();
})
$(function () {
// alert($.cookie("用户名"));//重启不能够取出相应的键值
//$.cookie("用户名", "tom");
//$.cookie("用户名", "tom", {expires:7,domain:'itcast.cn',secure:true}); $("qq").accordion();
}) </script>
</head>
<body>
<div id="qq">
<ul id="ul1">
<li>我的好友</li>
<li>张三<br />小王<br />小刘</li>
<li>亲人栏</li>
<li>张三<br />小王<br />小刘</li>
<li>大学同学</li>
<li>张三<br />小王<br />小刘</li>
<li>小学同学</li>
<li>张三<br />小王<br />小刘</li>
<li>高中同学</li>
<li>张三<br />小王<br />小刘</li>
<li>陌生人</li>
<li>张三<br />小王<br />小刘</li>
</ul>
</div>
<table id="tablecolor">
<tr><td style="background-color:red">红色</td>
<td style="background-color:blue">蓝色</td>
<td style="background-color:yellow">黄色</td></tr>
</table>
<script type="text/javascript">
$(function () {
$("#tablecolor td").click(function () {
var bgcolor = $(this).css("background-color");
$("body").css("background-color", bgcolor);
$.cookie("bgcolor",bgcolor,{expires:7});
});
})
$(document).ready(function () {//记忆窗口的颜色
if ($.cookie("bgcolor"))
$("body").css("background-color", $.cookie("bgcolor"));
}); </script>
</body>
</html>

JQuery学习六的更多相关文章

  1. jQuery学习(六)——使用JQ完成省市二级联动

    1.JQ的遍历操作 方式一: 1 $(function(){ //全选/全不选 $("#checkallbox").click(function(){ var isChecked= ...

  2. jquery 学习(六) - 事件绑定

    HTML <!--绑定事件--> <div class="a1"> <button class="bt">按钮</bu ...

  3. 初步学习jquery学习笔记(六)

    jquery学习笔记六 AJAX 简介 AJAX 是与服务器交换数据的技术,它在不重载全部页面的情况下,实现了对部分网页的更新. load() 方法 load() 方法从服务器加载数据,并把返回的数据 ...

  4. 第二十六篇 jQuery 学习8 遍历-父亲兄弟子孙元素

    jQuery 学习8 遍历-父亲兄弟子孙元素   jQuery遍历,可以理解为“移动”,使用“移动”还获取其他的元素.   什么意思呢?老师举一个例子: 班上30位同学,我是新来负责教这个班学生的老师 ...

  5. jQuery 学习笔记

    jQuery 学习笔记   一.jQuery概述    宗旨: Write Less, Do More.    基础知识:        1.符号$代替document.getElementById( ...

  6. 大量Javascript/JQuery学习教程电子书合集

    [推荐分享]大量Javascript/JQuery学习教程电子书合集,送给有需要的人   不收藏是你的错^_^. 经证实,均可免费下载. 资源名称 资源大小   15天学会jQuery(完整版).pd ...

  7. [推荐分享]大量Javascript/JQuery学习教程电子书合集,送给有需要的人

    不收藏是你的错^_^. 经证实,均可免费下载. 资源名称 资源大小   15天学会jQuery(完整版).pdf 274.79 KB   21天学通JavaScript(第2版)-顾宁燕扫描版.pdf ...

  8. day 84 Vue学习六之axios、vuex、脚手架中组件传值

    Vue学习六之axios.vuex.脚手架中组件传值   本节目录 一 axios的使用 二 vuex的使用 三 组件传值 四 xxx 五 xxx 六 xxx 七 xxx 八 xxx 一 axios的 ...

  9. jQuery学习之路(1)-选择器

    ▓▓▓▓▓▓ 大致介绍 终于开始了我的jQuery学习之路!感觉不能再拖了,要边学习原生JavaScript边学习jQuery jQuery是什么? jQuery是一个快速.简洁的JavaScript ...

随机推荐

  1. [ML] the notes

    "Machine Learning is not who has the best algorithm that wins. It is who has the most data.&quo ...

  2. Python3 循环表达式

    一 While循环 基本循环 while 条件: 执行内容 #循环体 ... #循环体 ... #循环体 # 若条件为真,执行循环体内容 # 若条件为假,不执行循环体内容 实例1(Python 3.0 ...

  3. JavaScript筑基篇(一)->变量、值与对象

    说明 JavaScript中变量.值.对象的理解.本文为了简化理解,前半部分暂时刨除与执行上下文的相关概念.另外本文是个人的见解,如有疑问或不正支持,欢迎提出指正和讨论! 目录 前言 参考来源 变量与 ...

  4. Python为什么会打印两个\

    在Python里面,如果\后面不是一个合法的转移字符,那么,Python会打印两个\,换句话说,Python将\也当成普通字符看待,而不是转义符的标志: >>>S = 'C:\py\ ...

  5. 20162328蔡文琛week03

    学号 2006-2007-2 <程序设计与数据结构>第X周学习总结 教材学习内容总结 在第三章,我学习到了更多有关于java.util包的知识.了解了多个引用变量可以指向同一个对象.而且J ...

  6. No Route to Host from master/192.168.2.131 to master:9000 failed on socket t

    host里边添加的ip地址与当前的ip地址(ifconfig可以查看)不一致,修改当前ip地址就可以了.

  7. 算法与数据结构实验题 4.1 伊姐姐数字 game

    ★实验任务 伊姐姐热衷于各类数字游戏,24 点.2048.数独等轻轻松松毫无压力.一 日,可爱的小姐姐邀请伊姐姐一起玩一种简单的数字 game,游戏规则如下: 一开始桌上放着 n 张数字卡片,从左到右 ...

  8. lintcode-179-更新二进制位

    179-更新二进制位 给出两个32位的整数N和M,以及两个二进制位的位置i和j.写一个方法来使得N中的第i到j位等于M(M会是N中从第i为开始到第j位的子串) 注意事项 In the function ...

  9. WE团队团队汇总

    WE团队目录 一.博客汇总 团队展示 选题报告 二.文档汇总 选题报告

  10. JSTL标签之核心标签

    JSTL(JSP Standard Tag Library ,JSP标准标签库)是一个实现 Web应用程序中常见的通用功能的定制标记库集,这些功能包括迭代和条件判断.数据管理格式化.XML 操作以及数 ...