防止启动下拉列表关闭点击 [英] Prevent Bootstrap dropdown from closing on clicks
本文介绍了防止启动下拉列表关闭点击的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我的菜单使用Bootstrap 3,我无法阻止从点击关闭的下拉列表。如何做?
My menu uses Bootstrap 3 and I can't prevent dropdown from closing on click. How can I do it?
// Add open class if active
$('.sidebar-nav').find('li.dropdown.active').addClass('open');
// Open submenu if active
$('.sidebar-nav').find('li.dropdown.open ul').css("display","block");
// Change active menu
$(".sidebar-nav > li").click(function(){
$(".sidebar-nav > li").removeClass("active");
$(this).addClass("active");
});
// Add open animation
$('.dropdown').on('show.bs.dropdown', function(e){
$(this).find('.dropdown-menu').first().stop(true, true).slideDown();
});
// Add close animation
$('.dropdown').on('hide.bs.dropdown', function(e){
$(this).find('.dropdown-menu').first().stop(true, true).slideUp();
});
推荐答案
您需要停止事件冒泡DOM树:
You need to stop event from bubbling up the DOM tree:
$('.dropdown-menu').click(function(e) {
e.stopPropagation();
});
event.stopPropagation
阻止事件到达最终由Bootstrap隐藏菜单处理的节点。
event.stopPropagation
prevents event from reaching the node where it's eventually handled by Bootstrap hiding menu.
这篇关于防止启动下拉列表关闭点击的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文