將Cookie添加到輸入背景顏色更改

Question

我在網站上添加了背景顏色更改效果。 現在，我希望將該更改應用於所有其他頁面。 我在理解Cookie函數時遇到了麻煩，因此，使用我正在研究的內容確實很有幫助。

我的JS：
function background(color){document.body.style.backgroundColor=color;}

我的HTML：
<tr><td class="bggreen" style="cursor: pointer" onclick="background('green')">&nbsp;</td></tr>

我的CSS：
.bggreen { background-color: green; }

該代碼都可以正常工作，因此某些信息可能毫無意義。 只是，如果我要構造一個cookie來使這些顏色更改應用於網站中的所有相關頁面，我將如何處理？ 沒有選擇使用PHP還是JS。 我只想了解最實用的內容。

Answer 1

這是我從javascript使用的一些簡單的cookie函數。 您可以將最新的顏色值存儲在cookie中，然后在頁面初始化后，可以從cookie中讀取值並適當地設置顏色：

function createCookie(name, value, days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
}

function eraseCookie(name) {
    createCookie(name,"",-1);
}

name和value是字符串。 days是cookie過期之前的天數。

因此，無論何時更改顏色，都可以執行以下操作：

function background(color){
    document.body.style.backgroundColor = color;
    createCookie("backgroundColor", color, 365);
}

而且，當頁面首次加載時，您可以執行以下操作：

var color = readCookie("backgroundColor");
if (color) {
    document.body.style.backgroundColor = color;
}