jQuery cookie在wordpress中无法正常工作

时间:2015-04-16 13:03:24

标签: jquery html wordpress cookies

我使用html + jquery制作我自己的手风琴菜单,它完美地工作到第四级,然后我从网上添加一个cookie代码并做一些额外的工作,它也可以100%完美地在html中工作。

我的完整HTML + jQuery代码参考在JS-Fiddle Accordion Menu with Cookie

现在我非常仔细地将它合并到我的wordpress菜单中,它显示了非常奇怪的行为。当我点击加上子菜单打开,我点击子类别页面进入该类别,但菜单是关闭但当我再次打开子菜单,然后单击菜单或刷新页面的工作。我担心为什么在wordpress中jquery cookie无效。

这是jquery cookie + jquery手风琴代码:

jQuery(document).ready(function () {


   // baking cookie ;p
   function set_cookie(ID) {
         document.cookie = ID + "=opened";
   }

   // getting it out from the oven... ;)
   function get_cookies_array() {

       var cookies = {};

       if (document.cookie && document.cookie != '') {
          var split = document.cookie.split(';');
          for (var i = 0; i < split.length; i++) {
              var name_value = split[i].split("=");
              name_value[0] = name_value[0].replace(/^ /, '');
              cookies[decodeURIComponent(name_value[0])] = decodeURIComponent(name_value[1]);
          }
       }

       return cookies;

   }

   // yuck... sorry i don't know how to cook :S
   function unset_cookie(cookie_name) {
        var cookie_date = new Date();
        cookie_date.setTime(cookie_date.getTime() - 1);
        document.cookie = cookie_name += "=; expires=" + cookie_date.toGMTString();
   }

   var tree_id = 0;
   jQuery('ul.b29-tree li:has(ul)').addClass('has-child').prepend('<span class="switch">+</span>').each(function () {
                    tree_id++;
                    jQuery(this).attr('id', 'tree' + tree_id);
                });
   // Accordion code
   jQuery('ul.b29-tree li > span.switch').click(function () {
            var tree_id = jQuery(this).parent().attr('id');
            if (jQuery(this).hasClass('open')) {
                        jQuery(this).parent().find('ul:first').slideUp('fast');
                        jQuery(this).removeClass('open');
                        jQuery(this).text('+');
                        unset_cookie(tree_id)
                    } else {
                        jQuery(this).parent().find('ul:first').slideDown('fast');
                        jQuery(this).text('-');
                        jQuery(this).addClass('open');
                        set_cookie(tree_id)

                    }
                });

                var cookies = get_cookies_array();
                for (var name in cookies) {
                    $('#' + name).find('> ul').css({'display' : 'block'});
                    $('#' + name).find('> span').addClass('open').text('-');
                }

            });

我在xamp上使用wordpress,所以我无法给你链接,但上面的链接是html的演示

1 个答案:

答案 0 :(得分:0)

确定,

我自己解决这个问题。我使用wordpress cookiepath常量,它完全适用于wordpress。

这是jquery代码:

jQuery(document).ready(function () {
                // baking cookie ;p
                function set_cookie(ID) {
                    document.cookie = ID + "=opened; path=<?php echo COOKIEPATH ?>";
                }

                // getting it out from the oven... 
                function get_cookies_array() {
                    var cookies = {};

                    if (document.cookie && document.cookie != '') {
                        var split = document.cookie.split(';');
                        for (var i = 0; i < split.length; i++) {
                            var name_value = split[i].split("=");
                            name_value[0] = name_value[0].replace(/^ /, '');
                            cookies[decodeURIComponent(name_value[0])] = decodeURIComponent(name_value[1]);
                        }
                    }
                    return cookies;
                }

                // yuck... sorry i don't know how to cook :S
                function unset_cookie(cookie_name) {
                    var cookie_date = new Date();
                    cookie_date.setTime(cookie_date.getTime() - 1);
                    document.cookie = cookie_name += "=; expires=" + cookie_date.toGMTString() + "; path=<?php echo COOKIEPATH ?>";
                }

                var tree_id = 0;
                jQuery('ul.wpc-categories li:has(ul)').addClass('has-child').prepend('<span class="switch"><img src="<?php echo plugin_dir_url(__FILE__); ?>/includes/css/images/icon-plus.png" /></span>').each(function () {
                    tree_id++;
                    jQuery(this).attr('id', 'tree' + tree_id);
                });

                jQuery('ul.wpc-categories li > span.switch').click(function () {
                    var tree_id = jQuery(this).parent().attr('id');
                    if (jQuery(this).hasClass('open')) {
                        jQuery(this).parent().find('ul:first').slideUp('fast');
                        jQuery(this).removeClass('open');
                        jQuery(this).html('<img src="<?php echo plugin_dir_url(__FILE__); ?>/includes/css/images/icon-plus.png" />');
                        unset_cookie(tree_id)
                    } else {
                        jQuery(this).parent().find('ul:first').slideDown('fast');
                        jQuery(this).html('<img src="<?php echo plugin_dir_url(__FILE__); ?>/includes/css/images/icon-minus.png" />');
                        jQuery(this).addClass('open');
                        set_cookie(tree_id)
                    }
                });

                var cookies = get_cookies_array();
                for (var name in cookies) {
                    jQuery('#' + name).find('> ul').css({'display' : 'block'});
                    jQuery('#' + name).find('> span').addClass('open').html('<img src="<?php echo plugin_dir_url(__FILE__); ?>/includes/css/images/icon-minus.png" />');
                }
            });