2 willpan112 willpan112 于 2017.01.09 19:29 提问

localstorage如何存储样式

<!doctype html>

<head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <script src="http://libs.baidu.com/jquery/1.7.0/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <style>
        .box {
            width: 100px;
            height: 100px;
            background: #333;
            color: #fff;
            margin: 15px auto;
        }
        .one{
            display: none;
        }
    </style>
</head>

<body>
    <div class="box">1</div>
    <div class="box">2</div>
    <div class="box">3</div>
    <div class="box">4</div>
    <div class="box">5</div>
    <div class="box one">6</div>
    <script type="text/javascript">
        $('.box').on('click', ev => {
            let css = localStorage.getItem('style'); // 读取存储
            css = css ? JSON.parse(css) : {
                background: 'red',
                click: 0
            }
            css.click++; // 记录点击次数
            $(ev.currentTarget).css(css); // 设置样式
            localStorage.setItem('style', JSON.stringify(css)); // 覆盖存储
            if(css.click == "5") {
                $(".one").css('display','block');
            };
        })
    </script>
</body>

3个回答

JE_GE
JE_GE   2017.01.09 20:01

都是用键值对来存储啊

showbo
showbo   Ds   Rxr 2017.01.09 20:48

你不是弄好了?要搞什么东东?localStorage只能存储字符串,对象之类的要转为对应的json字符串后存储

showbo
showbo 回复willpan112: 你默认不就是红色的,后续的都从style这个key键获取值,就是红色的。。你自己先搞清楚逻辑
11 个月之前 回复
willpan112
willpan112 只有点击数存进去了,样式好像没存成功
11 个月之前 回复
CodeFarmerCXY
CodeFarmerCXY   2017.01.10 19:42
Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!