如何禁用Bootstrap的Button下拉列表

Mik*_*ike 28 jquery twitter-bootstrap

链接在这里:bootstrap按钮下拉菜单

我想禁用此按钮下拉列表,我添加了disabled类,<a>但仍然可以通过单击下拉按钮打开下拉列表.有任何想法吗?

Chr*_*all 42

disabled类添加到按钮...

<div class="btn-group">
    <button class="btn btn-primary dropdown-toggle disabled" data-toggle="dropdown">Action <span class="caret"></span></button>
    <ul class="dropdown-menu">
      <li><a href="#">Action</a></li>
      <li><a href="#">Another action</a></li>
      <li><a href="#">Something else here</a></li>
      <li class="divider"></li>
      <li><a href="#">Separated link</a></li>
    </ul>
</div>
Run Code Online (Sandbox Code Playgroud)

通过bootstraps网站编辑时可行.我注意到他们没有像他们的例子一样使用锚.

<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
Run Code Online (Sandbox Code Playgroud)

  • 小心这只会使按钮LOOK禁用(无论使用A或BUTTON标签),JS功能在包括IE11和Chrome在内的许多浏览器上仍然启用,请参阅[BS3 Docs](http://getbootstrap.com/css/#callout -buttons禁用锚) (4认同)
  • 非常感谢指出这一点,我改为使用<button>并且它有效,我认为这可能是Bootstrap的doc的错误. (2认同)

Jai*_*Jai 14

是的,你可以这样做:

$('.dropdown-toggle').data('toggle', '');
Run Code Online (Sandbox Code Playgroud)

这只有在获得此属性时才有效:data-toggle="dropdown",您可以将其更改dropdown''空白.

或者您可以尝试删除attr data-toggle

$('.dropdown-toggle').removeAttr('data-toggle');
Run Code Online (Sandbox Code Playgroud)


gaw*_*ron 7

您需要做的就是设置按钮的disabled属性.

$('.dropdown-toggle').prop('disabled', true);
Run Code Online (Sandbox Code Playgroud)

http://getbootstrap.com/2.3.2/base-css.html#buttons禁用状态