javascript - 更改事件在 Bootstrap 多重选择字段中不起作用

Question

我的 HTML 页面包含 Bootstrap 多重选择字段:

<select class="form-control bootstrap-select"
    data-style="alpha-grey-300 pt-5 pb-5 pl-10 text-size-mini" multiple
    id="associated.persons"
    data-live-search="true">
</select>

每次进行一组新的选择时，jQuery 更改事件都不起作用。当我编写这段代码时，

$('#associated.persons').change(function (e) {
        console.log("Input changed !!!!!!!!!!!!!!!");
    });

控制台上什么也没写。我不知道问题到底出在哪里。

Answer 1

您不能在 ID 或类(class)名称中使用点。实际上，将主题标签和点结合在相同的规则中，表示您的选择器搜索 ID 为“关联”和类别为“人员”的集团。

重命名您的 ID，并且不要在您的 ID 或类(class)名称中使用点。如果您想创建包含多个单词的 ID 或类名，请使用 - 或 _。

你可以这样做:

<select class="form-control bootstrap-select"
    data-style="alpha-grey-300 pt-5 pb-5 pl-10 text-size-mini" multiple
    id="associated-persons"
    data-live-search="true">
</select>

还有

$('#associated-persons').change(function (e) {
        console.log("Input changed !!!!!!!!!!!!!!!");
});