bootstrap-sass 多选事件冲突

Question

我在使用 bootstrap-sass 和 bootstrap-multiselect 时遇到了一个奇怪的问题。 似乎 bootstrap-sass 事件处理程序会阻止下拉列表等的多选处理程序。

这个包是通过 bower 安装的：

'bootstrap-sass-official#3.3.1',
'bootstrap-multiselect'

基于 django 和 python 构建的应用，所以模板将脚本绑定到页面：

{% compress js %}
    <script src="{% static 'jquery/dist/jquery.js' %}"></script>
    <script src="{% static 'bootstrap-sass/assets/javascripts/bootstrap.js' %}"></script>
{% endcompress %}

在特定页面上绑定脚本使用：

{% block extrajs %}
    <script src="{{ STATIC_URL }}bower_components/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"
            type="text/javascript" charset="utf-8"></script>
{% endblock %}

创建多选控件：

$('.multiselect').multiselect()

没什么特别的。但是当我尝试在 UI 上使用多选控件时，它不会下拉。控制台没有错误。

在浏览了一些代码后，我发现有一些事件处理程序阻止了多选处理程序的执行：

  // APPLY TO STANDARD DROPDOWN ELEMENTS
  // ===================================

  $(document)
    .on('click.bs.dropdown.data-api', clearMenus)
    .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
    .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
    .on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown)
    .on('keydown.bs.dropdown.data-api', '[role="menu"]', Dropdown.prototype.keydown)
    .on('keydown.bs.dropdown.data-api', '[role="listbox"]', Dropdown.prototype.keydown)

因此，棘手的解决方案是首先在使用多选的页面上关闭标准事件处理程序：

$(document)
     .off('click.bs.dropdown.data-api')
     .off('keydown.bs.dropdown.data-api')

这似乎有点老套，对我来说不是最好的解决方案。

是否有解决此冲突的本地方法？谢谢。

Answer 1

认为 Bootstrap 链接到页面两次。显式如上所示，通过 stepoftheweb.com 主题捆绑脚本隐式显示（我在问题中省略了这个细节，我认为没关系）

所以，我删除了第一个链接到页面的脚本，现在它可以正常工作了。