缩短JQuery cookies代码
缩短JQuery cookies代码
提问于 2013-07-17 05:07:46
我正在创建允许用户通过JQuery更改颜色的小部件
<img id="blue1" src="color_blue.png" />
<img id="red1" src="color_red.png" />
<img id="yellow1" src="color_yellow.png" />
<img id="green1" src="color_green.png" />
<img id="grey1" src="color_grey.png" />
$("img#blue1").on("click", function() {
$(this).parent().parent().parent().css("background", "#3399cc");
$(this).parent().parent().parent().css("border", "1px solid #1E6081");
$(this).parent().parent().parent().children('h1').css("background", "#a9c0cc");
$(this).parent().parent().parent().children('h1').css("border-bottom", "1px solid #1E6081");
}); 等。
我希望通过cookies保存颜色，以便用户在页面刷新或离开时具有相同的颜色，因此我使用JQuery cookies插件。
这是我的代码：
$("#w1 img#blue1").on("click", function() {
$.cookie('wcolor1', 'blue')
});
if ($.cookie('wcolor1') == 'blue')
{
$('#w1').css("background", "#3399cc");
$('#w1').css("border", "1px solid #1E6081");
$('#w1 h1').css("background", "#a9c0cc");
$('#w1 h1').css("border-bottom", "1px solid #1E6081");
}我觉得必须有一种更简单的方法来做这件事，我有6个小部件，每个小部件都有5个颜色选项，当然有一种方法可以压缩这些函数。
提前感谢那些提供帮助的人。
Stack Overflow用户
发布于 2013-07-17 05:20:01
您可以使用对象定义属性，如下所示：
var theme = {
blue: {
'background-color': 'blue',
'border' : '1px solid blue'
//add all your "blue" theme options
},
green: {
'background-color': 'green',
'border' : '1px solid green'
//add all your "green" theme options
}
} 然后，您可以使用相同的函数检索所有主题的选项：
var selectedTheme = $.cookie('wcolor1');
if(theme[selectedTheme] !== "undefined"){
$('#w1').css("background", theme[selectedTheme].background);
$('#w1').css("border", theme[selectedTheme].border);
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/17687003
复制相关文章
相似问题
腾讯云开发者
