利用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 相关文章推荐
用ADODB.Stream转换
Jan 22 Javascript
15 个 JavaScript Web UI 库
May 19 Javascript
jQuery中阻止冒泡事件的方法介绍
Apr 12 Javascript
JavaScript获取指定元素位置的方法
Apr 08 Javascript
详解angularjs的数组传参方式的简单实现
Jul 28 Javascript
浅谈sass在vue注意的地方
Aug 10 Javascript
微信小程序表单验证插件WxValidate的二次封装功能(终极版)
Sep 03 Javascript
深入了解JS之作用域和闭包
Jun 16 Javascript
Postman动态获取返回值过程详解
Jun 30 Javascript
JavaScript undefined及null区别实例解析
Jul 21 Javascript
Openlayers+EasyUI Tree动态实现图层控制
Sep 28 Javascript
JS创建自定义对象的六种方法总结
Dec 15 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
一个简单的MySQL数据浏览器
2006/10/09 PHP
ThinkPHP 在阿里云上的nginx.config配置实例详解
2017/10/11 PHP
PHP基于imagick扩展实现合成图片的两种方法【附imagick扩展下载】
2017/11/14 PHP
基于 Swoole 的微信扫码登录功能实现代码
2018/01/15 PHP
PHP PDOStatement::debugDumpParams讲解
2019/01/30 PHP
Laravel 前端资源配置教程
2019/10/18 PHP
JavaScript 异步方法队列链实现代码分析
2010/06/05 Javascript
关于IE中getElementsByClassName不能用的问题解决方法
2013/08/26 Javascript
javascript:FF/Chrome与IE动态加载元素的区别说明
2014/01/26 Javascript
JavaScript 获取任一float型小数点后两位的小数
2014/06/30 Javascript
jQuery实现仿腾讯迷你首页选项卡效果代码
2015/09/17 Javascript
Vue.js基础知识汇总
2016/04/27 Javascript
Angular实现一个简单的多选复选框的弹出框指令实例
2017/04/25 Javascript
react-router实现按需加载
2017/05/09 Javascript
详解Javascript获取缓存和清除缓存API
2017/05/25 Javascript
React Native 真机断点调试+跨域资源加载出错问题的解决方法
2018/01/18 Javascript
Hexo已经看腻了,来手把手教你使用VuePress搭建个人博客
2018/04/26 Javascript
angularjs1.5 组件内用函数向外传值的实例
2018/09/30 Javascript
JavaScript&quot;模拟事件&quot;的注意要点详解
2019/02/13 Javascript
js笔试题-接收get请求参数
2019/06/15 Javascript
Angular.JS读取数据库数据调用完整实例
2019/07/02 Javascript
通过实例解析javascript Date对象属性及方法
2020/11/04 Javascript
[39:11]DOTA2上海特级锦标赛C组资格赛#2 LGD VS Newbee第二局
2016/02/28 DOTA
Flask框架URL管理操作示例【基于@app.route】
2018/07/23 Python
python中ImageTk.PhotoImage()不显示图片却不报错问题解决
2018/12/06 Python
Python3.5基础之函数的定义与使用实例详解【参数、作用域、递归、重载等】
2019/04/26 Python
python快速排序的实现及运行时间比较
2019/11/22 Python
tensorflow 动态获取 BatchSzie 的大小实例
2020/06/30 Python
搭建pypi私有仓库实现过程详解
2020/11/25 Python
中国跨境海淘网站:考拉海购
2016/08/01 全球购物
劳动工资科岗位职责范本
2014/03/02 职场文书
会计与出纳自荐书范文
2014/03/16 职场文书
《花瓣飘香》教学反思
2014/04/15 职场文书
2015年食品安全宣传周活动总结
2015/07/09 职场文书
不知如何爱孩子,这些方法教会您
2019/08/06 职场文书
纯CSS实现酷炫的霓虹灯效果
2021/04/13 HTML / CSS