将背景颜色更改为本地颜色.存储(价值)

Change background color with local.Storage (value)

本文关键字:颜色 存储 价值 背景      更新时间:2023-09-26

我想更改div的背景色:

箭头框

为此,我必须分配给你可以点击的地方。triggerd函数保存"farbe"键的本地存储值。

<div class="radior" style="background-color:#8066CC;"    onClick='localStorage.setItem("farbe","#8066CC");hey()'></div> 

因此,在那之后,键"farbe"的值被问到。此外,这是一个案例。。。我想你最好读一下我的代码,因为我想我需要一些英语课对不起!

function hey(){
switch (localStorage.getItem("farbe")){
case "#121212":
var h = "black"
case "#1bc38e":
var h = "turk"
case "#C3594B":
var h = "red"
case "#8066CC":
var h = "lila"
    }
document.getElementsByClassName("arrow_box")[0].style.backgroundColor=""+h+""; ;
   }

Some它怎么不起作用了!或者你看一个关于我小提琴问题的例子http://jsfiddle.net/PpsLH/4/!来自德国的问候!

将函数更改为:

hey = function(){
  switch (localStorage.getItem("farbe")){
    case "#121212":
    var h = "black";
    break ;
    case "#1bc38e":
    var h = "turk";
    break ;
    case "#C3594B":
    var h = "red";
    break ;
    case "#8066CC":
    var h = "lila";
    break ;
  }
    document.getElementsByClassName("arrow_box")[0].style.backgroundColor=h;
}

顺便说一下,lila不是一个有效的HTML颜色,所以它不起作用。

您应该从代码中删除任何内联事件处理程序。此外,整个切换部分和更改为命名的CSS颜色似乎是多余的。看看jQuery 中写的这段代码

var box = $('div.arrow_box');
$('body').on('click','div.radior',function(e){
    var color = $(e.target).css('backgroundColor');    
    localStorage.setItem('farbe',color);
    box.css('backgroundColor',color);
});

和一把工作小提琴http://jsfiddle.net/chrisdanek/BaJvC/5/

尝试这个

<div  class="arrow_box"><a>Arrow Box</a></div>

<div class="radior" style="background-color:#C3594B;" onClick="localStorage.setItem('farbe','#C3594B');window.hey()"></div>
<br>
<div class="radior" style="background-color:#8066CC;" onclick='localStorage.setItem("farbe","#8066CC");window.hey()'></div>

对于javascript

window.hey = function ()
{
    var h="";
    if (localStorage.getItem("farbe")=="#121212")
    {
        var h = "black";
    } else
    if (localStorage.getItem("farbe")=="#1bc38e")
    {
        var h = "turk";
    } else
    if (localStorage.getItem("farbe")=="#C3594B")
    {
        var h = "red";
    } else
    if (localStorage.getItem("farbe")=="#8066CC")
    {
        var h = "lila";
    }
    document.getElementsByClassName("arrow_box")[0].style.backgroundColor=h+"";
}