我在我的表单中使用select2 for Multiselect选项。在表单中我使用键控制来遍历表单。所以如果我按Tab键它应该遍历表单中的字段。当我按Tab键去选择2文本框,它会打开选项,默认选择第一项。当我按Tab键移动到另一个字段时,它会自动选中。我想避免这个。请帮助......
我想避免在select2插件中选择默认的第一个元素。我在调用select2.It时尝试删除highlight()函数。它正在工作但无法选择元素。
$("#" + elementID).select2({
data: {results: itemArray, name: 'name'},
formatSelection: format,
formatResult: format,
multiple: true,
closeOnSelect: false,
height: height,
width: width,
allowClear:true,
initSelection: function (element, callback) {
var data = [];
$(element.val().split(",")).each(function () {
data.push({id: this.toString(), name: this.toString()});
});
return callback(data);
},
createSearchChoice: function (term, data) {
if ($(data).filter(function () {
return this.name.localeCompare(term) === 0;
}).length === 0) {
return {id: term, name: term};
}
}
}).select2('data', null).one('select2-focus', select2Focus).on("select2-blur", function () {
$(this).one('select2-focus', select2Focus);
});
答案 0 :(得分:0)
添加一个空选项将解决此问题。
$(document).ready(function() {
$('select').select2({
placeholder: {
id: '', // the value of the option
text: 'None Selected'
},
allowClear: true
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
<select style="width : 150px">
<option value=""></option>
<option value="AL">Alabama</option>
<option value="NJ">New Jesrsey</option>
</select>
答案 1 :(得分:0)
将其作为选择的第一个选项,以HTML格式
<option value="" selected disabled>Select item...</option>
答案 2 :(得分:-1)
您可能需要将multiple
属性添加到选择本身
<select class="js-data-example-ajax" multiple="multiple">
...
</select>