jquery 手风琴菜单 - 链接问题
我正在使用这个 http://www.i-marco.nl/weblog /jquery-accordion-menu/ 手风琴菜单。
问题是,主菜单链接只能用于扩展子菜单,但不能 本身充当链接。我希望主菜单链接转到链接并(我通过 php 脚本设置展开类)展开子菜单。
这是代码:
html(示例):
<span class="acc_menu">
<ul class="menu">
<li class="expand">
<a href="/a_page.html">A page</a>
<ul class="menu nestedmenu acitem">
<li><a href="/other_page.html">Other page</a></li>
<li><a href="/other_page2.html">Other page 2</a></li>
<li><a href="/other_page3.html">Other page 3</a></li>
</ul>
</li>
</ul>
jquery:
jQuery.fn.initMenu = function() {
return this.each(function(){
var theMenu = $(this).get(0);
$('.acitem', this).hide();
$('li.expand > .acitem', this).show();
$('li.expand > .acitem', this).prev().addClass('active');
$('li a', this).click(
function(e) {
e.stopImmediatePropagation();
var theElement = $(this).next();
var parent = this.parentNode.parentNode;
if($(parent).hasClass('noaccordion')) {
if(theElement[0] === undefined) {
window.location.href = this.href;
}
$(theElement).slideToggle('normal', function() {
if ($(this).is(':visible')) {
$(this).prev().addClass('active');
}
else {
$(this).prev().removeClass('active');
}
});
return false;
}
else {
if(theElement.hasClass('acitem') && theElement.is(':visible')) {
if($(parent).hasClass('collapsible')) {
$('.acitem:visible', parent).first().slideUp('normal',
function() {
$(this).prev().removeClass('active');
}
);
return false;
}
return false;
}
if(theElement.hasClass('acitem') && !theElement.is(':visible')) {
$('.acitem:visible', parent).first().slideUp('normal', function() {
$(this).prev().removeClass('active');
});
theElement.slideDown('normal', function() {
$(this).prev().addClass('active');
});
return false;
}
}
}
);
});
};
$(document).ready(function() {
$('.menu').initMenu();
}); // enter code here
I'm using this http://www.i-marco.nl/weblog/jquery-accordion-menu/ accordion menu.
Problem is, is that the main-menu links only work to expand the sub-menu, but don't
function as links themselves. I want the main-menu links to go to the link and (i set the expand class via a php script) unfold the sub-menu.
Here's the code:
html (example):
<span class="acc_menu">
<ul class="menu">
<li class="expand">
<a href="/a_page.html">A page</a>
<ul class="menu nestedmenu acitem">
<li><a href="/other_page.html">Other page</a></li>
<li><a href="/other_page2.html">Other page 2</a></li>
<li><a href="/other_page3.html">Other page 3</a></li>
</ul>
</li>
</ul>
jquery:
jQuery.fn.initMenu = function() {
return this.each(function(){
var theMenu = $(this).get(0);
$('.acitem', this).hide();
$('li.expand > .acitem', this).show();
$('li.expand > .acitem', this).prev().addClass('active');
$('li a', this).click(
function(e) {
e.stopImmediatePropagation();
var theElement = $(this).next();
var parent = this.parentNode.parentNode;
if($(parent).hasClass('noaccordion')) {
if(theElement[0] === undefined) {
window.location.href = this.href;
}
$(theElement).slideToggle('normal', function() {
if ($(this).is(':visible')) {
$(this).prev().addClass('active');
}
else {
$(this).prev().removeClass('active');
}
});
return false;
}
else {
if(theElement.hasClass('acitem') && theElement.is(':visible')) {
if($(parent).hasClass('collapsible')) {
$('.acitem:visible', parent).first().slideUp('normal',
function() {
$(this).prev().removeClass('active');
}
);
return false;
}
return false;
}
if(theElement.hasClass('acitem') && !theElement.is(':visible')) {
$('.acitem:visible', parent).first().slideUp('normal', function() {
$(this).prev().removeClass('active');
});
theElement.slideDown('normal', function() {
$(this).prev().addClass('active');
});
return false;
}
}
}
);
});
};
$(document).ready(function() {
$('.menu').initMenu();
}); // enter code here
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
只需将
target="_blank"
添加到您的父链接,然后删除return false;
Just add
target="_blank"
to your parent link, and remove thereturn false;