使用jQuery cookie.js来记住hide / show元素？

我找到了一个关于如何在页面上显示和隐藏某个div的精彩教程。 我得到的代码工作正常，但我想扩展是在页面加载时记住show / hide。 我已经找到了解决方案jQuery cookie就是答案..如果我知道如何编写实际的代码是..这是当前的代码片段：

 jQuery(document).ready(function() { // hides the group_desciption as soon as the DOM is ready // (a little sooner than page load) jQuery('#group_desciption').hide(); // shows the group_desciption on clicking the noted link jQuery('a#slick-show').click(function() { jQuery('#group_desciption').show('slow'); return false; }); // hides the group_desciption on clicking the noted link jQuery('a#slick-hide').click(function() { jQuery('#group_desciption').hide('fast'); return false; }); // toggles the group_desciption on clicking the noted link jQuery('a#slick-toggle').click(function() { jQuery('#group_desciption').toggle(400); return false; }); }); 

知道如何添加cookie以记住用户的选择吗？ 一个代码示例会很棒，因为我仍然试图掌握jQuery / Javascript 🙂

提前致谢 ：）

Answer 1

应该很容易。 当你显示div添加一些代码，如：

 jQuery.cookie('show_desc', 'yep'); 

……当你隐藏div时：

 jQuery.cookie('show_desc', 'nope'); 

…然后在代码的顶部，你有：

 jQuery('#group_desciption').hide(); 

…改为：

 var shouldShow = jQuery.cookie('show_desc') == 'yep'; if( shouldShow ) { jQuery('#group_desciption').show(); } else { jQuery('#group_desciption').hide(); } 

或者，或者：

 jQuery('#group_desciption')[jQuery.cookie('show_desc') == 'yep' ? 'show' : 'hide'](); 

🙂