我自己制作手风琴菜单html + jquery 它可以完美地工作到第四级，然后我从网络中添加了一个cookie代码，并做了一些额外的工作，它在html中也可以100%完美地工作。
我完整的HTML+jQuery代码参考是在JS FIDLE中Accordion Menu with Cookie
现在我非常小心地将它合并到我的wordpress菜单中，它显示出非常奇怪的行为。当我单击plus时，子菜单打开，我单击sub category时，页面将转到该类别，但菜单关闭，但当我再次打开子菜单并单击菜单或刷新页面时，其工作。我担心为什么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(\'-\');
}
});
我正在wordpress中开发我的xamp，所以我不能给你那个链接，但上面的链接是html的演示
最合适的回答,由SO网友:deemi-D-nadeem 整理而成
好啊
我在@TheDeadMedic的帮助下解决了这个问题。我使用wordpresscookiepath 常数，它在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" />\');
}
});
