事件

当使用 Select2 组件执行不同操作时，Select2 将触发一些不同的事件，允许你添加自定义钩子并执行操作。你也可以使用以下方法在 Select2 控件上手动触发这些事件：.trigger.

事件	描述
`change`	在任何时候当选项被选中或移除时都会触发该事件。
`change.select2`	受限版本的`change`。请参见下面了解更多详情。
`select2:closing`	在下拉菜单关闭之前触发。此事件可以被阻止。
`select2:close`	每当下拉菜单关闭时都会触发该事件。`select2:closing`在此之前被触发，并且可以被阻止。
`select2:opening`	在下拉菜单打开之前触发。此事件可以被阻止。
`select2:open`	每当下拉菜单打开时都会触发该事件。`select2:opening`在此之前被触发，并且可以被阻止。
`select2:selecting`	在某个结果被选中之前触发。此事件可以被阻止。
`select2:select`	每当一个结果被选中时就会触发该事件。`select2:selecting`在此之前被触发，并且可以被阻止。
`select2:unselecting`	在移除某个选中项之前触发。此事件可以被阻止。
`select2:unselect`	每当某个选中项被移除时都会触发该事件。`select2:unselecting`在此之前被触发，并且可以被阻止。
`select2:clearing`	在清除所有选中项之前触发。此事件可以被阻止。
`select2:clear`	每当所有选中项被清除时都会触发该事件。`select2:clearing`在此之前被触发，并且可以被阻止。

监听事件

所有公开事件都通过 jQuery 事件系统进行转发，并且它们会在 Select2 所依附的 DOM 元素上触发。<select>Select2 所绑定的元素。你可以使用 jQuery 提供的.on方法方法来监听它们：

$('#mySelect2').on('select2:select', function (e) {
  // Do something
});

事件数据

当select2:select事件被触发时，可以通过params.data属性访问选中的数据：

$('#mySelect2').on('select2:select', function (e) {
    var data = e.params.data;
    console.log(data);
});

e.params.data将返回包含选中属性的对象。任何在数据源中提供的与选中项相关的额外数据也将包含在此对象中。例如：

{
  "id": 1,
  "text": "Tyto alba",
  "genus": "Tyto",
  "species": "alba"
}

触发事件

你可以使用 jQuery 的trigger方法在 Select2 控件上手动触发事件。但是，如果你想将一些数据传递给事件的处理函数，你需要构造一个新的jQueryEvent对象对象并在其上触发：

var data = {
  "id": 1,
  "text": "Tyto alba",
  "genus": "Tyto",
  "species": "alba"
};

$('#mySelect2').trigger({
    type: 'select2:select',
    params: {
        data: data
    }
});

限制`change`事件的作用范围

其他组件通常会监听change事件，或者可能绑定了具有副作用的自定义事件处理器。为了限制作用范围，仅限于并仅通知 Select2 发生了更改，请使用.select2事件命名空间：

$('#mySelect2').val('US'); // Change the value or make some change to the internal state
$('#mySelect2').trigger('change.select2'); // Notify only Select2 of changes

示例

阻止事件

参见https://stackoverflow.com/a/26706695/2970321.

Select2 的内部事件

Select2 拥有一个内部事件系统它独立于 DOM 事件系统运行，允许适配器之间相互通信。这个内部事件系统只能从连接到 Select2 的插件和适配器中访问 —不要通过 jQuery 事件系统。

你可以在各个适配器触发的公共事件中找到更多相关信息：高级章节.

事件