javascript - 使用 JS 触发 Bootstrap 下拉菜单

标签 javascript jquery css twitter-bootstrap

我需要通过 JavaScript 打开 Bootstrap 下拉菜单。 This answer建议添加和删除 open 类,但是当我尝试这样做时,没有任何反应。添加不同的类效果很好。 Bootstrap 是否阻止我这样做?

JSFiddle 上的工作示例.

HTML

<input type="button" value="Add Classes" />
<div class="dropdown">
    <a data-toggle="dropdown" href="#">Dropdown Trigger</a>
    <div class="dropdown-menu">Dropdown Content</div>
</div>

JS

$('input').click(function () {
    $('.dropdown').addClass('open');
    $('.dropdown').addClass('test-class');
});

最佳答案

您的主要问题是您没有阻止点击事件传播到文档。 Bootstrap 在关闭下拉菜单的 document 上设置了一个事件监听器。

$('input').on('click', function (e) {
    e.stopPropagation();
    $(this).next('.dropdown').find('[data-toggle=dropdown]').dropdown('toggle');
});

jsFiddle - http://jsfiddle.net/8p6Wd/2/

关于javascript - 使用 JS 触发 Bootstrap 下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21035565/

相关文章:

javascript - 从数组中删除对象 onclick

javascript - 如何在数据内容属性中换行?

javascript - 提交前更改表单的键名、值和操作 URL

html - 如何使用 html 从 Shiny 的 SelectInput 中包装输入?

html - 你如何让一个div和屏幕一样大?

javascript - Google Cloud Endpoint 没有通过 JavaScript 客户端的结果

javascript - 正确编码的字符串在插入 window.location.hash 时被解码

c# - 如何让我的弹出窗口在 ASP.NET MVC 中的 AJAX 调用的提交按钮上关闭?

jquery - 如何捕获正在调用的 Javascript 函数?

javascript - 如何将按钮制作为输入类型文件