我使用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的演示
答案 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" />');
}
});