为什么 .change() 不适用于 twitter-bootstrap 选择？答案

【问题标题】：Why is .change() not working for the twitter-bootstrap select?为什么 .change() 不适用于 twitter-bootstrap 选择？
【发布时间】：2015-11-14 11:01:03
【问题描述】：

我正在尝试在此选择上使用 .change()，但遇到了问题。我似乎无法让它工作。

<div class='btn-group twoColumn js-filter'>
    <button class='btn btn-info disabled'>Category</button>
    <a class='btn dropdown-toggle' data-toggle='dropdown' href='#' id='test'>
        <span class='btn_selected_value data-point-category'>
            All
        </span>
        <span class='caret'></span>
    </a>
    <ul class='dropdown-menu'>
        <li class='selectAll'>
            <a class='filter' data-filter='#filterCategoryId' data-value='All' href='#'>All</a>
        </li>
        <li>
            <a class='filter' data-filter='#filterCategoryId' data-value='test333' href='#'>test333</a>
        </li>
    </ul>
</div>

这个console.log 没有被解雇：

$('.data-point-category').on('change', function() {
  console.log("what")
});

我应该将.data-point-cateogry 类放在哪里以便我可以通过 jQuery 使用它？

【问题讨论】：

您需要为哪些变化触发函数？
这不是select 元素，它是一堆HTML 元素。 change 仅由一些原生表单元素触发，例如 select 和 input。
您所拥有的只是链接和一个按钮。什么都没有改变。
抱歉，没有
在这个问题上，有几个例子可以将事件添加到 Bootstrap 下拉列表中。可能有帮助！ stackoverflow.com/questions/11989146/…

标签： javascript jquery html twitter-bootstrap

【解决方案1】：

change 事件不会在 HTML 更改时触发。

来自jQuery documentation：

change 事件在元素值改变时发送到元素。这事件仅限于<input> 元素、<textarea> 框和<select> 元素。对于选择框、复选框和单选按钮，事件当用户使用鼠标进行选择时立即触发，但对于其他元素类型，事件被推迟到元素失去焦点。

相反，您需要以下内容：

$('.filter').on('click', function() {
  console.log("what")
});

这将在每次单击下拉选项时执行您想要的操作，这实际上与更改值相同。

【讨论】：