本地存儲改變背景顏色

-2

我想改變我的網站的背景顏色與本地存儲。我使用onchange()的HTML中colours()函數中，剩下的是JavaScript低於本地存儲改變背景顏色

var bgcolour; 

window.onload = function theme(){ 

    document.body.style.backgroundColor = "red"; 
    localStorage.setItem("bgcolour", 1); 
} 


function colours(){ 
    localStorage.bgcolour = document.getElementById("party").value; 

    if (localStorage.bgcolour == '1'){ 
     document.body.style.backgroundColor = "red"; 
    } 
}

它什麼都不做。它甚至不會改變，更不用說將其存儲爲本地存儲。

我不斷丟失重要的小部分代碼，感覺就像我再次用這個代碼做的那樣。

任何幫助，非常感謝！

HTML：

<select name="pnumber" id="party" onchange="colours()"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
    <option value="6">6</option> 
    <option value="7">7</option> 
    <option value="8">8</option> 
    <option value="9">9</option> 
    <option value="10">10</option> 
    <option value="11">11</option> 
    <option value="12">12</option> 
    <option value="13">13</option> 
    <option value="14">14</option> 
    <option value="15">15 (maximum)</option> 
</select>

來源

2017-06-05 JavaNovice

您可以發佈您的HTML？ – chakeda

代碼錯誤，您不正確地設置和檢查localStorage值。另外，您需要從ID party獲取節點的值。

var bgcolour; 
 

 
window.onload = function theme(){ 
 

 
    document.body.style.backgroundColor = "red"; 
 
    localStorage.setItem("bgcolour", 1); 
 
} 
 

 
var party = document.getElementById('party') 
 
function colours(){ 
 
    
 
    localStorage.setItem('bgcolor', party.value); 
 

 
    if (localStorage.getItem('bgcolour') === '1'){ 
 
     document.body.style.backgroundColor = "red"; 
 
    } 
 
    else{ 
 
    document.body.style.backgroundColor = "green"; 
 
    } 
 
}

<select name="pnumber" id="party" onchange="colours()"> 
 
    <option value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
    <option value="4">4</option> 
 
    <option value="5">5</option> 
 
    <option value="6">6</option> 
 
    <option value="7">7</option> 
 
    <option value="8">8</option> 
 
    <option value="9">9</option> 
 
    <option value="10">10</option> 
 
    <option value="11">11</option> 
 
    <option value="12">12</option> 
 
    <option value="13">13</option> 
 
    <option value="14">14</option> 
 
    <option value="15">15 (maximum)</option> 
 
</select>

來源

2017-06-05 18:47:55 Rick

我甚至無法讓它在多個頁面上工作，而且這段代碼有點凌駕於我的頭上，不過謝謝你！ – JavaNovice

然而，我知道，如果不這樣做，我不相信你能夠實現你的目標。讓我知道如果你想澄清或額外的幫助 – Rick

其他人（這是類）已經實現了它非常簡單的代碼，我*看起來*相似，但我顯然缺少的東西。這太令人沮喪了。至少，我需要能夠做到這一點，而不使用事件監聽器。 – JavaNovice

你似乎有從本地存儲設置和獲取價值的一些問題。以下是它是如何完成的。

//商店

localStorage.setItem("lastname", "Smith");

//檢索

document.getElementById("result").innerHTML = localStorage.getItem("lastname");

來源

2017-06-05 16:41:41

這並沒有什麼幫助。我在W3上看到了這一點，它與獲取和更改背景顏色值無關，也沒有解釋我應該如何實現它。 – JavaNovice

我不明白你想在這裏完成什麼。您是否想要將背景顏色設置爲紅色並在發生事件時進行更改。請解釋更多你的需求。 –

我想改變我的網站的背景顏色，並使用localstorage，使背景顏色保持改變。 – JavaNovice

我相信事情是不對您的HTML。 See this plunk。我複製粘貼所有的JavaScript和我假設你的HTML是這樣的：

<input type="text" id="party" onchange="colours()" />

你會發現，背景爲灰色原來，然後把值「1」，在文本框中會做背景紅。

來源

2017-06-05 17:18:55 chakeda

我的html完全一樣，它不起作用。編輯。我說謊。這是

本地存儲改變背景顏色

回答