使用jQuery Cookie保持CSS高度

-1

我有一個按鈕，它設置了CSS高度，即使在頁面刷新後我也需要保持相同的高度。下面是代碼：使用jQuery Cookie保持CSS高度

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

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

的問題是，我從來沒有處理餅乾之前，而且不知道如何設置一個，然後在加載頁面閱讀。任何人都可以幫助我瞭解如何使用jQuery Cookie來確保CSS高度在刷新後保持不變？

謝謝

來源

2013-06-19 user2028856

參見：http://stackoverflow.com/questions/4825683/how-do-i-create-and-read-a-value-from-cookie和http://stackoverflow.com/questions/2010892/storing- objects-in-html5-localstorage –

這些是針對JavaScript和HTML5的方法，我需要使用jQuery Cookie插件的幫助。 – user2028856

該插件必須具有某種文檔。例如：https：//github.com/carhartl/jquery-cookie/blob/master/README.md –

使用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"); 
}

來源

2013-06-19 12:30:16

感謝Kumar的回答，請你解釋一下這個問題！在答案的第一部分是什麼意思？還要在changeHeight函數之前或之後包含這個嗎？ – user2028856

如果未設置cookie，則最初設置cookie。 :) ps：給我打電話Praveen。 –

@ user2028856，'！'它是邏輯非運算符（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators）。基本上，把'false'變成'true'，將'true'變成'false'。因爲當cookie沒有被設置時''.cookie（）'返回false，使用'！'會使結果爲'true'，從而執行'if'條件體。它相當於'if（$ .cookie（「height」）！= false）'。 –

如果您使用標準的JavaScript，下面的文章應該幫助： http://www.w3schools.com/js/js_cookies.asp

如果你使用jQuery，那就更簡單了，使用這個插件： http://www.electrictoolbox.com/jquery-cookies/

來源

2013-06-19 12:30:41 gamma

我確實想使用它，但問題是我不知道如何在我的情況下使用它以及如何閱讀它 – user2028856

避免鏈接到w3schools：http://www.w3fools.com/ –

要創建一個cookie的使用：

$.cookie('height', heightValue);

要讀它，使用：

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

，並刪除它，使用：

$.cookie('height', null);

來源

2013-06-19 12:32:04 user2501130

考慮添加一個引用到你的例子中使用的插件。 –

可以使用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在這種情況下意味着：

你這樣設置的cookie：

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

現在你罵餅乾這樣的：

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

輸出將是：

somevalue

來源

2013-06-19 12:34:51

'the_value'來自哪裏？ – user2028856

看我的簡單例子。關於價值 –

使用jQuery Cookie保持CSS高度

回答

相關問題