我正在尝试使用jQuery
创建一个手风琴菜单。在这里,我附上了我的html
和jquery
代码,以便更好地理解。
<div id='accordion_menu'>
<ul>
<li class='has-sub'><a href='#'><span>Products</span></a>
<ul>
<li><a href='product1.html'><span>Product 1</span></a></li>
<li><a href='product2.html'><span>Product 2</span></a></li>
<li><a href='#'><span>Product 3</span></a></li>
</ul>
</li>
<li class='has-sub'><a href='#'><span>About</span></a>
<ul>
<li><a href='company.html'><span>Company</span></a></li>
<li><a href='team.html'><span>Team</span></a></li>
</ul>
</li>
<li><a href='contact.html'><span>Contact</span></a></li>
</ul>
</div>
/* Sidebar Accordion Menu
========================================================*/
;
(function($) {
$( document ).ready(function() {
$('#accordion_menu > ul > li > a').click(function() {
$('#accordion_menu li').removeClass('active');
$(this).closest('li').addClass('active');
var checkElement = $(this).next();
if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
$(this).closest('li').removeClass('active');
checkElement.slideUp('normal');
}
if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
$('#accordion_menu ul ul:visible').slideUp('normal');
checkElement.slideDown('normal');
}
if($(this).closest('li').find('ul').children().length == 0) {
return true;
} else {
return false;
}
});
});
})(jQuery);
我的任务是在页面加载时我需要保持第一个子菜单始终打开,并且在访问自己的页面时需要为内部active
添加li
类。
有人可以告诉我如何修改这个jquery吗?
希望有人可以帮助我。 谢谢。