Bootstrap Select2 使用总结

Select2是一种流行的JavaScript库，它能够为HTML元素提供自动完成和搜索功能。以下是使用Select2的一些常见方法
1. **基本用法**:
首先需要在HTML中引入Select2的样式文件和JavaScript文件。例如：
```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/select2/4.0.13/css/select2.min.css">
[removed][removed]
```
然后在需要的地方添加Select2的实例：
```html
<select class="js-example" name="example">
选择一项
选项 1
选项 2
选项 3
</select>
```
在JavaScript中初始化Select2：
```javascript
$(document).ready(function () {
$('.js-example').select2({
placeholder: '选择一项'
});
});
```
2. **远程数据源**: 如果需要从服务器获取选项，可以使用`ajax`配置项。例如：
```javascript
$.ajax({
url: '/api/options',
data: {q: $('#js-example').val()}, // 根据输入框的值发送请求
dataType: 'json',
success: function (data) {
$('#js-example').select2({
placeholder: '选择一项',
ajax: {
url: '/api/options',
delay: 250, // 延迟时间，单位毫秒
data: function (term) {
return {q: term}; // 返回查询参数对象
},
results: function (data, page) {
var results = $.map(data, function (item) {
return {text: item.name, id: item.id};
});
return {results: results};
}
}
});
}
});
```
3. **多选**: 如果需要允许多选，可以设置`multiple`选项。例如：
```javascript
$('.js-example').select2({
placeholder: '选择一项或多项',
multiple: true
});
```