jquery - 更改正文标签中的背景图像并保留在整个站点中

Question

我成功地使用 jQuery 在单击按钮时更改标签的背景图像。但是，更改不会在更改页面时保留。我该如何设置？代码如下:

HTML:

主体类=“蓝色”

jQuery:

$("#triangle").click( function(){ 
    $("body").removeClass('green , pink , red').addClass("green");
    $('li#circle').removeClass('selected');
    $('li#x').removeClass('selected');
    $('li#square').removeClass('selected');
    $('li#triangle').addClass('selected');
});
$("#circle").click( function(){ 
    $("body").removeClass('blue , green , pink').addClass("red");
    $('li#triangle').removeClass('selected');
    $('li#x').removeClass('selected');
    $('li#square').removeClass('selected');
    $('li#circle').addClass('selected');
});

$("#x").click( function(){ 
    $("body").removeClass('red , green , pink').addClass("blue");
    $('li#triangle').removeClass('selected');
    $('li#circle').removeClass('selected');
    $('li#square').removeClass('selected');
    $('li#x').addClass('selected');
});

$("#square").click( function(){ 
    $("body").removeClass('blue , green , red').addClass("pink");
    $('li#triangle').removeClass('selected');
    $('li#circle').removeClass('selected');
    $('li#x').removeClass('selected');
    $('li#square').addClass('selected');
});

Answer 1

如果您希望通过 JavaScript 所做的更改在页面之间持续存在，则需要设置 cookie。我推荐 jQuery cookie 插件来设置和读取 cookie:http://plugins.jquery.com/project/Cookie

您的代码可能看起来像这样(快速草图，因此可能不存在语法错误):

    //On Window Load
        if ($.cookie('bodyclass')) {
          var bodyClass = $.cookie('bodyclass');
          $('body').addClass(bodyClass);
        }

        //On element click, set your body class
       //eg:
        $('#square')click(function(){
         $.cookie('bodyclass','pink');
        });