使用Javascript更改背景顏色並在刷新頁面後保留它

當使用Javascript單擊按鈕時，我正在更改背景的顏色。使用Javascript更改背景顏色並在刷新頁面後保留它

這是JS代碼：

<script> 
function myFunction() { 
    document.body.style.backgroundColor = "#BB0A21"; 
} 
</script>

它工作正常，但問題是，當用戶刷新頁面，背景色是被重置爲原來的顏色。有沒有辦法阻止這種情況發生？

感謝，麗莎

來源

2015-07-03 Lisa

將會話或本地存儲中的背景顏色值存儲並應用於該元素中。 –

除了Bhojendra尼泊爾的評論：https：//developer.mozilla.org/en-US/docs/Web/API/Window/localStorage – RhinoDevel

可以存儲在本地會話中的顏色變化。你需要檢查會話是否已經有了值，如果沒有設置。這將生存頁面刷新等

function myFunction() { 
     if (sessionStorage.getItem('colour')) { 
      document.body.style.backgroundColor = sessionStorage.getItem('colour'); 
     }else{ 
      document.body.style.backgroundColor = "#BB0A21"; 
      sessionStorage.setItem('colour', "#BB0A21"); 
     } 
    } 

    // then you'll need to call your function on page load 
    myFunction();

來源

2015-07-03 14:00:28 atmd

謝謝。你能告訴我如何將它與現有的JS結合嗎？ – Lisa

已經更新了包含您的功能的答案 – atmd

你必須存儲在客戶端Cookie或服務器端會話的顏色值。現代瀏覽器也支持localStorage

來源

2015-07-03 14:00:56

使用Javascript更改背景顏色並在刷新頁面後保留它

回答

相關問題