利用cookie记住背景颜色示例代码


Posted in Javascript onNovember 04, 2013
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title></title> 
<script type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script> 
<script src="Scripts/jquery.cookie.js" type="text/javascript"></script> 
<style type="text/css"> 
#p1{ background-color:Red ; width:40px; border:solid 1px yellow ; margin:5px; float:left} 
#p2{background-color:Yellow ;width:40px; border:solid 1px red; margin:5px; float:left} 
#p3{background-color:Blue;width:40px; border:solid 1px yellow; margin:5px; float:left} 
</style> 
<script type="text/javascript"> 
$(function () { 
if ($.cookie("bgcolor")) { 
$("body").css("background-color", $.cookie("bgcolor")); 
} $("p").click(function () { 
$("body").css("background-color", $(this).css("background-color")); 
$.cookie("bgcolor", $("body").css("background-color"), { expires: 7 }); 
}) 
}) 
</script> 
</head> 
<body> 
<p id="p1">红色</p><p id="p2">黄色</p><p id="p3">蓝色</p> 
</body> 
</html>
Javascript 相关文章推荐
动态加载图片路径 保持JavaScript控件的相对独立性
Sep 06 Javascript
html中table数据排序的js代码
Aug 09 Javascript
一个关于jqGrid使用的小例子(行按钮)
Nov 04 Javascript
JavaScript 参数中的数组展开 [译]
Sep 21 Javascript
判断iframe里的页面是否加载完成
Jun 06 Javascript
js监听鼠标点击和键盘点击事件并自动跳转页面
Sep 24 Javascript
使用JS实现图片展示瀑布流效果(简单实例)
Sep 06 Javascript
Bootstrap实现圆角、圆形头像和响应式图片
Dec 14 Javascript
this.$toast() 了解一下?
Apr 18 Javascript
jquery实现简单自动轮播图效果
Jul 29 jQuery
vue cli3.0打包上线静态资源找不到路径的解决操作
Aug 03 Javascript
原生JavaScript实现贪吃蛇游戏
Nov 04 Javascript
判断滚动条到底部的JS代码
Nov 04 #Javascript
js控制不同的时间段显示不同的css样式的实例代码
Nov 04 #Javascript
js实现瀑布流的一种简单方法实例分享
Nov 04 #Javascript
jquery监听div内容的变化具体实现思路
Nov 04 #Javascript
让新消息在网页标题闪烁提示的jQuery代码
Nov 04 #Javascript
Js判断参数(String,Array,Object)是否为undefined或者值为空
Nov 04 #Javascript
浅析return false的正确使用
Nov 04 #Javascript
You might like
《PHP编程最快明白》第三讲:php数组
2010/11/01 PHP
在MongoDB中模拟Auto Increment的php代码
2011/03/06 PHP
PHP 杂谈《重构-改善既有代码的设计》之三 重新组织数据
2012/04/09 PHP
深入分析php中接口与抽象类的区别
2013/06/08 PHP
解决PHP mysql_query执行超时(Fatal error: Maximum execution time …)
2013/07/03 PHP
php精确的统计在线人数的方法
2015/10/21 PHP
详解thinkphp中的volist标签
2018/01/15 PHP
CSS3画一个阴阳八卦图
2021/03/09 HTML / CSS
jquery 插件学习(二)
2012/08/06 Javascript
简易js代码实现计算器操作
2013/04/15 Javascript
通过JQuery将DIV的滚动条滚动到指定的位置方便自动定位
2014/05/05 Javascript
输入框过滤非数字的js代码
2014/09/18 Javascript
基于jquery的手风琴图片展示效果实现方法
2014/12/16 Javascript
nodejs中实现阻塞实例
2015/03/24 NodeJs
jquery使用remove()方法删除指定class子元素
2015/03/26 Javascript
JS数组操作(数组增加、删除、翻转、转字符串、取索引、截取(切片)slice、剪接splice、数组合并)
2016/05/20 Javascript
基于jQuery实现页面搜索功能
2020/03/26 Javascript
Vue.js 表单校验插件
2016/08/14 Javascript
JS去掉字符串前后空格、阻止表单提交的实现代码
2017/06/08 Javascript
Vue axios设置访问基础路径方法
2018/09/19 Javascript
使用Sonarqube扫描Javascript代码的示例
2018/12/26 Javascript
微信小程序 冒泡事件原理解析
2019/09/27 Javascript
ES2020让代码更优美的运算符 (?.) (??)
2021/01/04 Javascript
python清除字符串里非数字字符的方法
2015/07/02 Python
详解Python中的Cookie模块使用
2015/07/06 Python
浅谈Pandas Series 和 Numpy array中的相同点
2019/06/28 Python
Python常用模块sys,os,time,random功能与用法实例分析
2020/01/07 Python
matplotlib之pyplot模块坐标轴标签设置使用(xlabel()、ylabel())
2021/02/22 Python
中东地区最大的奢侈品市场:The Luxury Closet
2019/04/09 全球购物
俄罗斯极限运动网上商店:Board Shop №1
2020/12/18 全球购物
竞争性谈判邀请书
2014/02/06 职场文书
幼儿园运动会口号
2014/06/07 职场文书
班组拓展活动方案
2014/08/14 职场文书
工作失职检讨书(精华篇)
2014/10/15 职场文书
学校中秋节活动总结
2015/03/23 职场文书
2016年社区六一儿童节活动总结
2016/04/06 职场文书