点击后引导下拉关闭点击后引导下拉关闭(Bootstrap dropdown closing when

2019-05-16 23:16发布

我把形式的自举下拉列表中,但是当我点击任何形式的字段,下拉消失。 我有这样的一段代码,但我不知道在哪里把它防止下拉消失。

$(function test() {
  // Setup drop down menu
  $('.dropdown-toggle').dropdown();

  // Fix input element click problem
  $('.dropdown input, .dropdown label').click(function(e) {
    e.stopPropagation();
  });
});

可能有人请告诉我,我应该把这个? 我试图在引导-下拉列表中,我尝试在HTML中,但它仍然无法正常工作。

Answer 1:

只需使用这example.This解决方案对我的作品。

<script type="text/javascript">
window.addEvent('domready',function() {    
   Element.prototype.hide = function() {
      $(function () { 
        // replace your tab id with myTab
        //<ul id="myTab" class="nav nav-tabs">
        $('#myTab li:eq(1) a').tab('show');
      });      
   };
});
</script>

希望能对大家有所帮助。 谢谢。



Answer 2:

您可以省略下拉呼叫一起,引导下拉工作离不开它。 确保您包裹你的脚本正确,可以将其包含在你的页面的页眉或身体,但我个人更喜欢把它放在你的页面的主体。

JS

<script type="text/javascript">
    $('.dropdown-menu input, .dropdown-menu label').click(function(e) {
        e.stopPropagation();
    });
</script>


Answer 3:

如果你想停止只关闭一些下拉菜单中,不是所有的人,则只需添加一个附加的类到您的UL块:

<ul class="dropdown-menu keep-open-on-click">

并使用此代码:

$(document).on('click', '.dropdown-menu', function(e) {
    if ($(this).hasClass('keep-open-on-click')) { e.stopPropagation(); }
});


Answer 4:

时间,因为答案通过已被接受,但如果你想保持下拉打开,如果它的作用就像是一种对话,我认为最好的方法是:

$('.dropdown').dropdown().on("hide.bs.dropdown", function(e) {
            if ($.contains(dropdown, e.target)) {
                e.preventDefault();
            //or return false;
            }
        });


Answer 5:

您需要冒泡DOM树停止事件:

$('.dropdown-menu').click(function(e) {
    e.stopPropagation();
});

event.stopPropagation防止事件到达那里它最终被引导隐藏菜单处理的节点。



Answer 6:

这适用于我的(横向侧边栏打开与引导拨动一个简单的链接)

$('.dropdown').find("a").not('.dropdown-toggle').on("click",function(e){
    e.stopImmediatePropagation();
});


Answer 7:

如果你看的下拉列表控件来源的底部,你会看到:

$(document)
  .on('click.bs.dropdown.data-api', '.dropdown form', function(e) {
    e.stopPropagation()
  })

所以,你有以下选择:

  1. 简单地包裹与侑形式下拉
  2. 或者你也可以添加事件侦听器.dropdown YOUR_SELECTOR的单击事件
$(document)
  .on('click.my', '.dropdown some_selector', function(e) {
    e.stopPropagation()
  })


Answer 8:

Thank you for the above answer, I was having the same issue w/ submenus under the dropdown menus. Using the above solution I was able to solve the problem for this as well.

$('.dropdown-menu .dropdown-submenu a[data-toggle="dropdown-submenu"]').click(function (e)
{                   
    e.stopPropagation();
});


Answer 9:

<script type="text/javascript">
    $('.dropdown-menu').click(function(e) {
          e.stopPropagation();
    });
</script>

在原来的答案,删除所有类,只是把“.dropdown菜单”级,它为我工作。 我有下拉菜单内的输入字段。



文章来源: Bootstrap dropdown closing when clicked