我的页面中有一个3级的会员菜单.当点击任何级别的链接时,协调人仍然打开,相应的页面在右边打开
目前我正在使用JQuery和XSLT.它支持三级,现在我要改5级了.虽然目前的实施工作有点复杂.所以我想知道,如果有人实现了相同的.
解决方法
<ul class="accordion-menu"> <li> <a href="#" class="title">Explore Careers</a> <ul> <li><a href="#">Set Careers</a></li> <li><a href="#">Salaries</a></li> </ul> </li> <li class="active"> <a href="#" class="title">Self assessments</a> <ul> <li> <a href="#">What is an assessment?</a> </li> <li> <a href="#" class="clicked">Interest assessment</a> </li> <li><a href="#">Skills assessment</a></li> <li><a href="#">Work values</a></li> </ul> </li> <li> <a href="#" class="title">Learn about careers</a> <ul> <li><a href="#">Licenses</a></li> <li><a href="#">Professions</a></li> </ul> </li> </ul>
我添加了一个新的类标题来标识手风琴头,以避免使用慢速子选择器.
现在在你的脚本中,添加这个
$(document).ready(function(){
$('.title').on('click',function(){
var $parent = $(this).parent();
var $siblings = $parent.siblings();
$siblings.removeClass('active').find('ul').slideUp('normal');
$parent.find('ul').slideDown('normal');
$parent.addClass('active');
});
});
另外在您共享的这个live页面中,他们正在刷新整个页面以获取更新的内容.我建议您使用AJAX获取更新的内容,然后更新该容器,而不是进行全页刷新.这将提供更好的用户体验,并使您更轻松地跟踪选定的手风琴,而无需保留页面刷新之间的状态.
这是从你的更新fiddle更新我的更改.希望这可以帮助 ：)
