嗨我有一个手风琴菜单,所有工作正常,除非一个部分没有子类别我需要链接转到页面而不是尝试打开一个不在那里的子菜单。
如何在此代码中实现此功能?
$.noConflict();
$(document).ready(function() {
// Store variables
var accordion_head = $('ul.accordion > li > a.item'),
accordion_body = $('ul.accordion li > ul.sub-menu');
// Click function
accordion_head.on('click', function(event) {
// Disable header links
event.preventDefault();
// Show and hide the tabs on click
if ($(this).attr('class') != 'active'){
accordion_body.slideUp('normal');
$(this).next().stop(true,true).slideToggle('normal');
accordion_head.removeClass('active');
$(this).addClass('active');
}
});
});
... HTML
<div class="Block CategoryList Moveable" id="SideCategoryList">
<div class="BlockContent" id="dropDowns">
<ul class="accordion">
<li><a href="http://site-link.co.uk" >Main Category 1</a>
<ul class="sub-menu"> <li><a href="http://site-link.co.uk" class="item">item 1</a>
</li> <li ><a href="http://site-link.co.uk" class="item">item 2</a>
</li> <li ><a href="http://site-link.co.uk" class="item" >item 3</a>
</li> <li ><a href="http://site-link.co.uk" class="item">item 4</a>
</li></ul>
</li> <li ><a href="http://site-link.co.uk" class="item">Main Category 2</a>
</li> <li ><a href="http://site-link.co.uk" class="item">Main Category 3</a>
</li>
</ul>
答案 0 :(得分:0)
只是猜测:
// Disable header links
// event.preventDefault(); - handle this below
// Show and hide the tabs on click
if ($(this).attr('class') != 'active'){
accordion_body.slideUp('normal');
var subMenu = $(this).next('ul');
if (subMenu) {
subMenu.stop(true,true).slideToggle('normal');
event.preventDefault();
}
accordion_head.removeClass('active');
$(this).addClass('active');
} else {
event.preventDefault();
}
答案 1 :(得分:0)
在这里你进行http://jsfiddle.net/davidchase03/WaQES/更改,因为第一个没有课程项目
var accordion_head = $('ul.accordion > li > a')
并添加
// Disable header links
if ( $(this).next().hasClass('sub-menu') ) {
event.preventDefault();
}