建议您在初始化Select2时通过传入一个对象来声明配置选项。但是,您也可以使用HTML5定义配置选项data-*
属性,它将覆盖初始化Select2时设置的所有选项以及任何默认值。
<select data-placeholder="Select a state">
<option value="AL">Alabama</option>
...
<option value="WY">Wyoming</option>
</select>
不支持某些选项,因为
data-*
, 例如disabled
因为它不是Javascript选项,而是HTML 属性.
有时,您的选项嵌套在顶级选项下。例如,选项下的ajax
选项:
$(".js-example-data-ajax").select2({
ajax: {
url: "http://example.org/api/test",
cache: false
}
});
将这些选项写为data-*
属性,每个嵌套级别都应由两个破折号(--
)分隔:
<select data-ajax--url="http://example.org/api/test" data-ajax--cache="true">
...
</select>
该选项的值取决于jQuery的HTML5数据属性解析规则。
由于jQuery错误,嵌套选项使用
data-*
属性在jQuery 1.x中不起作用。
camelCase
选项HTML数据属性不区分大小写,因此所有包含大写字母的选项都将被解析,就好像它们都是小写字母一样。因为Select2有很多选项驼峰式(CamelCase),单词之间用大写字母隔开,所以必须用破折号写出这些选项。因此通常称为allowClear
应该改为 allow-clear
.
这意味着声明您的<select>
标记为…
<select data-tags="true" data-placeholder="Select an option" data-allow-clear="true">
...
</select>
将被解释为与将Select2初始化为…
$("select").select2({
tags: "true",
placeholder: "Select an option",
allowClear: true
});