利用cookie 记住背景颜色 (利用Jquery对Cookie进行设值与取值)

最新推荐文章于 2020-07-27 17:47:41 发布

无盐海

最新推荐文章于 2020-07-27 17:47:41 发布

阅读量1.6k

点赞数

分类专栏： JQuery 文章标签： JQuery

本文链接：https://blog.csdn.net/Fanbin168/article/details/14106389

版权

JQuery 专栏收录该内容

53 篇文章 0 订阅

订阅专栏

Jquery-Cookie官网地址

Cookie 在客户端设置值 $.cookie("键" , "值") Cookie中保存的值都是文本

Cookie 在客户端取值 $.cookie("键")

<!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;clear:right}
        #p2{background-color:Yellow ;width:40px; border:solid 1px red; margin:5px; float:left;clear:left}
        #p3{background-color:Blue;width:40px; border:solid 1px yellow; margin:5px; float:left;clear: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>

<2>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="jquery-1.11.2.js" type="text/javascript"></script>
    <script src="jquery.cookie-v1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {

            if ($.cookie("uName") != null) {
                
                //读取key为uName的这个Cookie的值
                $("#UserName").val($.cookie("uName"));
            }

            $("#btnClick").click(function () {

                //创建一个key为uName的Cookie ，值为$("#UserName").val() ；有效期为7天
                $.cookie("uName", $("#UserName").val(), { expires: 7 });
            })
        })
    </script>
</head>
<body>
<form id="form1">
<input type="text"  name="UserName" id="UserName"/>
<input type="button" value="提交"  id="btnClick"/>
</form>
</body>
</html>

无盐海

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
利用cookie 记住背景颜色 (利用Jquery对Cookie进行设值与取值)

#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{bac
复制链接

扫一扫