设置Cookie以记住下拉菜单状态 - JQuery

时间:2011-09-21 14:36:30

标签: jquery jquery-plugins

这是我的代码:

$(document).ready(function() {
    $("#root ul").each(function() {$(this).css("display", "none");});
    $("#root .category").click(function() {
        var childid = "#" + $(this).attr("childid");
        if ($(childid).css("display") == "none")     {
            $(childid).css("display", "block");
        }
        else {
            $(childid).css("display", "none");
        }
        if ($(this).hasClass("cat_close")) {
            $(this).removeClass("cat_close").addClass("cat_open");}
        else {
            $(this).removeClass("cat_open").addClass("cat_close");
        }
    });
});

你能帮我创建/设置一个cookie,它会记住离开页面或点击链接后打开的菜单框吗?顺便说一下,我想使用Jquery cookie插件。

谢谢!

1 个答案:

答案 0 :(得分:4)

使用jquery-cookie plugin

您的代码看起来像(如果我正确理解这里的内容):

<script type="text/javascript">
    jQuery(document).ready(function () {

        var selectedId = jQuery.cookie('selected-sub-menu-id'); // get selected submenu id
        jQuery("#root ul").each(function () {
            if (jQuery(this).attr('id') != selectedId) {
                jQuery(this).css("display", "none");
            }
        });
        jQuery("#root .category").click(function () {
            var childid = "#" + jQuery(this).attr("childid");

            jQuery(childid).toggle();

            if (jQuery(this).hasClass("cat_close")) {
                jQuery(this).removeClass("cat_close").addClass("cat_open"); 
            }
            else {
                jQuery(this).removeClass("cat_open").addClass("cat_close");
            }
            jQuery.cookie('selected-sub-menu-id', childid.substring(1)); // set selected submenu id
        });

    });
</script>