使用 Select2 禁用自动完成输入

Question

我正在使用 SELECT2 执行自动完成

<select  class="js-example-basic-single" id="existeField">
    <option value="" disabled selected>Selectionnée le
                                    champs</option>
    <option th:each="fields: ${listFields}" th:value="${fields.id}"
        th:data-jira="${fields.idJira}" th:data-type="${fields.type}"
        th:data-defaut="${fields.value}" th:text="${fields.nom}">
   </option>
</select> 



<script>
    $(document).ready(function() {
        $(".js-example-basic-single").select2();   

    });
</script>

它禁用了输入，而且设计也不是很好

Answer 1

问题不在 SELECT2 而在模态（这是一个标准的 bootstrap 模态）

模态

  <div class="modal fade" id="exampleModal" name="exampleModal"
                tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
                aria-hidden="true">
                <div class="modal-dialog" role="document">

  ....

解决方案是简单地删除 tabindex="-1"，一切都会 OK。

希望对大家有所帮助。

使用 Select2 禁用自动完成输入

disabled input for autocomplete using Select2

jquery

jquery-select2

ui-select2