利用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 相关文章推荐
jquery 学习之二 属性 文本与值(text,val)
Nov 25 Javascript
jquery 图片缩放拖动的简单实例
Jan 08 Javascript
jquery ajax应用中iframe自适应高度问题解决方法
Apr 12 Javascript
更快的异步执行(setTimeout多浏览器)
Aug 12 Javascript
js实现动态创建的元素绑定事件
Jul 19 Javascript
AngularJS表达式讲解及示例代码
Aug 16 Javascript
jQuery ajax请求struts action实现异步刷新
Apr 19 jQuery
微信小程序使用radio显示单选项功能【附源码下载】
Dec 11 Javascript
示例vue 的keep-alive缓存功能的实现
Dec 13 Javascript
详解vue路由篇(动态路由、路由嵌套)
Jan 27 Javascript
微信小程序开发实现的IP地址查询功能示例
Mar 28 Javascript
如何利用React实现图片识别App
Feb 18 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
详解WordPress中用于合成数组的wp_parse_args()函数
2015/12/18 PHP
mysql alter table命令修改表结构实例详解
2016/09/24 PHP
Discuz不使用插件实现简单的打赏功能
2019/03/21 PHP
PHP设计模式之数据访问对象模式(DAO)原理与用法实例分析
2019/12/12 PHP
CentOS7系统搭建LAMP及更新PHP版本操作详解
2020/03/26 PHP
JS JavaScript获取Url参数,src属性参数
2021/03/09 Javascript
extjs 的权限问题 要求控制的对象是 菜单,按钮,URL
2010/03/09 Javascript
jQuery 自定义函数写法分享
2012/03/30 Javascript
JS模拟自动点击的简单实例
2013/08/08 Javascript
地址栏传递中文参数乱码在js里用escape转码
2013/08/28 Javascript
javascript动画算法实例分析
2015/07/31 Javascript
JavaScript动态设置div的样式的方法
2015/12/26 Javascript
深入理解JavaScript中Ajax
2016/08/02 Javascript
JS实现页面进入和返回定位到具体位置
2016/12/08 Javascript
js中this对象用法分析
2018/01/05 Javascript
vue封装一个简单的div框选时间的组件的方法
2019/01/06 Javascript
jquery实现垂直无限轮播的方法分析
2019/07/16 jQuery
vue选项卡切换登录方式小案例
2019/09/27 Javascript
js+canvas实现画板功能
2020/09/13 Javascript
Python获取网页上图片下载地址的方法
2015/03/11 Python
合并百度影音的离线数据( with python 2.3)
2015/08/04 Python
Python3中的bytes和str类型详解
2019/05/02 Python
Python3网络爬虫开发实战之极验滑动验证码的识别
2019/08/02 Python
对Django 转发和重定向的实例详解
2019/08/06 Python
python 消除 futureWarning问题的解决
2019/12/25 Python
浅谈python累加求和+奇偶数求和_break_continue
2020/02/25 Python
使用Keras画神经网络准确性图教程
2020/06/15 Python
python实现简单的tcp 文件下载
2020/09/16 Python
python 写一个水果忍者游戏
2021/01/13 Python
解决Firefox下不支持outerHTML问题代码分享
2014/06/04 HTML / CSS
法律专业实习鉴定
2013/12/22 职场文书
青蓝工程实施方案
2014/03/27 职场文书
开工仪式策划方案
2014/05/23 职场文书
转让协议书
2015/01/27 职场文书
Jupyter Notebook 如何修改字体和大小以及更改字体样式
2021/06/03 Python
JS实现刷新网页后之前浏览位置保持不变示例详解
2022/08/14 Javascript