代码:
<li class="submenuList item-with-ul selected">
<a href="#">Blalab</a>
<ul class="sub-nav flexnav-show" style="display: block;">
<li><a href="#">Highlights</a></li>
<li><a href="#">Invited</a></li>
<li><a href="#">Talks</a></li>
</ul>
<span class="touch-button active"><i class="fa fa-chevron-down navicon"></i></span>
</li>
脚本:
$('.touch-button').on('click', function(e) {
var $touchButton;
$touchButton = $(this).parent('.item-with-ul').find('>span.touch-button');
$parent = $(this).parent('.item-with-ul');
$(".flexnav ul").removeClass('flexnav-show').hide();
$(this).parent().not('.selected').addClass('selected');
$('.selected').removeClass('selected');
//couldn't figure how to remove active from touch-button and add active as so to close and open the submenu
//$(this).removeClass('active');
// $touchButton.removeClass('active');
});
管理以在单击其他子菜单列表的按钮时删除/添加所选项。但是当按下下一个子菜单列表的下一个按钮时按钮仍处于活动状态。单击下一步按钮时无法删除或添加活动状态。
不确定为什么它不起作用(参见注释行)
答案 0 :(得分:0)
试试这个
$('.touch-button').on('click', function(e) {
$(this).removeClass('active');
});
答案 1 :(得分:0)
试试这个,
$('.touch-button').on('click', function(e) {
$('.touch-button').removeClass('active');// remove active from all touch-button
$(this).addClass('active'); // current touch button is active only now
)};
我认为你需要的是,
$('.touch-button').on('click', function(e) {
$('.touch-button').removeClass('active');
$('.item-with-ul').removeClass('selected');
$('.flexnav-show').hide();
$(this).addClass('active') // make current touch button active
.closest('.flexnav-show').show() // show the closest ul
.closest('.item-with-ul').addClass('selected'); //add the selected class to list item
});
答案 2 :(得分:0)
使用e.stopImmediatePropagation();
$(document).ready(function(e){
e.stopImmediatePropagation();
$('.touch-button').removeClass('active');// remove active from all touch-button
$(this).addClass('active'); // current touch button is active only now
});