删除 Select2 Jquery 插件中的默认选择答案

【问题标题】：Remove Default selection in Select2 Jquery Plugin删除 Select2 Jquery 插件中的默认选择
【发布时间】：2015-04-27 10:08:59
【问题描述】：

我在表单中将 select2 用于多选选项。在表单中，我使用键控件遍历表单。因此，如果我按 Tab 键，它应该遍历表单中的字段。当我按 Tab 键时选择2文本框，它会打开默认选择第一项的选项。当我按Tab键移动到另一个字段时，它会自动选择。我想避免这种情况。请帮助...

我想避免在 select2 插件中默认选择第一个元素。我在调用 select2 时尝试删除 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);
});

【问题讨论】：

你试过allowClear选项吗？
是的，但这也行不通
您可以尝试添加空值{id:'', text:''}，这将是第一项并会被选中
我可以在哪里添加这一行。要么到 initselection..我将在问题本身中附上我的代码。请参考它
你应该将它附加到你在初始化 select2 时传递的数据数组中

标签： jquery multi-select

【解决方案1】：

添加一个空选项将解决问题。

$(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>

【讨论】：

placeholder: {value: '',text: 'None Selected'},

【解决方案2】：

在 HTML 中将此作为第一个选项放在您的选择中

<option value="" selected disabled>Select item...</option>

【讨论】：

【解决方案3】：

您可能需要将multiple 属性添加到选择本身

<select class="js-data-example-ajax" multiple="multiple">
...
</select>

参考：https://github.com/select2/select2/issues/3878

【讨论】：

过去 2 小时我一直在寻找答案，因为这个答案被否决了，所以我没有立即对其进行测试：sad 谢谢@Tincho825