jquery - 使用 jquery cookie 保持 CSS 高度

Question

我有一个按钮来设置 CSS 高度，即使在页面刷新后我也需要保持不变。这是代码：

<script>
   function changeHeight(){
       $('#totalInfo').css('marginTop', '172px'); 
       $('.single #secondary-two #cart').css('maxHeight', '290px');
   }
</script>

<button onClick="changeHeight()">Change Height</button>

问题是，我以前从未处理过 cookie，也不知道如何设置一个，然后在加载页面时读取它。任何人都可以帮助我了解如何使用 jquery cookie 来确保 CSS 高度即使在刷新后也保持不变？

谢谢

Answer 1

使用jQuery.cookie插件。包含它后，您需要以这种方式调用它：

if (!$.cookie("height"))
    $.cookie("height", "297px");

当你给出一个changeHeight()函数时，也添加这个：

function changeHeight(){
    $('#totalInfo').css('marginTop', '172px'); 
    $('.single #secondary-two #cart').css('maxHeight', '290px');
    $.cookie("height", "297px");
}

Answer 2

You can use the jquery_cookie()

$("#myid").on("click") {
function changeHeight(){
       $('#totalInfo').css('marginTop', '172px'); 
       $('.single #secondary-two #cart').css('maxHeight', '290px');
    $.cookie('the_cookie', 'the_value', { expires: 7 });
});

<button id="myid">Change height</button>

the_value means in this case:

you set the cookie like this:

$.cookie("foo", "somevalue");

Now you call the cookie like this:

alert($.cookie("foo"));

the output will be:

somevalue

Answer 3

要创建 cookie，请使用：

$.cookie('height', heightValue);

要阅读它，请使用：

var height = $.cookie('height');

并删除它，使用：

$.cookie('height', null);

Answer 4

如果您使用的是标准 JavaScript，以下文章应该会有所帮助： http ://www.w3schools.com/js/js_cookies.asp

如果你使用 jQuery，使用这个插件会更容易： http ://www.electrictoolbox.com/jquery-cookies/