Question

我正在网站上工作：

http://tawfiq-aliyah.co.uk/epic/Site2/

我希望用户能够设置BackgroundImage。我已经使用左下角的弹出菜单实现了这个功能。但我想要的是存储用户选择背景图像的数据，这样当他们回到网站或移动到网站上的另一个页面时，它会加载相同的背景图像。

我在w3schools.com网站上查看过java cookies w3schools.com/js/js_cookies.asp

我看过这个例子，但我不知道如何让cookie存储而不是存储用户名的backgroundImage。

非常感谢任何帮助。感谢

Answer 1

我从来没有在javascript中使用过cookies，但是看看你提供的w3c示例，使用该技术并且只存储url而不是用户名是不是很好？然后将getgookie函数中的img：src或background-url或者你正在使用的URL设置为该url？（或者以后，每当dom准备就绪时）。

替代方案可能是使用本地存储，但对于您尝试执行的操作可能有点过分。

Answer 2

在背景图像选择器中缩略图的点击处理程序中，您可以执行以下操作：

onclick="main.style.backgroundImage='url(images/back3.jpg)'"

如果用函数替换它：

onclick="setBackgroundImage('images/back3.jpg')"

然后

function setBackgroundImage(url) {
    main.style.backgroundImage = 'url(' + url + ')';
    setCookie('BG', url, 100);    // Or however many days you want.
}

然后，在onload处理程序中，执行以下操作：

var bg = getCookie('BG');
if(bg)
    main.style.backgroundImage = 'url(' + bg + ')';

您可能希望对Cookie值进行更多的完整性检查，但是您有一个可用背景列表，因此您可以检查bg是否已定义且它是否在列表中。

此外，您可能希望对图像使用绝对URL而不是相对URL，这样可以更容易地移动图像。

用户设置BackgroundImage。将图片网址存储在Cookie中，以便下次访问时加载

2 个答案: