多选并选择第一个元素

Question

我已经为 id 多重选择创建了多重选择。我想选择第一个项目作为 selected 。    <select id="multiselect" multiple="multiple" name="project_list" class="jqmsLoaded ms-list-1" style="display: none;"><option value="Blue QA">Blue QA</option><option value="Easybridge">Easybridge</option><option value="K12RS">K12RS</option><option value="LEM">LEM</option></select> $('#multiselect').multiselect({        search:true,        selectAll: true,        //select : [0], //        texts: {          search: 'Search Projects',           placeholder: 'Select Projects',      },      });我想选择加载时选择的蓝色 QA。选项是动态加载的。尝试添加为$('#multiselect select option:first-child').prop("selected", true); 但没有运气

Answer 1

需要调用多选时，可以通过再次调用多选的选项来选择多选的选项。

$('#multiselect').multiselect({

        search:true,

        selectAll: true,

        texts: {

          search: 'Search Projects',

           placeholder: 'Select Projects',

        },

      });

      

      var select_1 =  $('#multiselect option:eq(0)').val();

      //selecting element of multiiselect

      $('#multiselect').multiselect('select', select_1);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/js/bootstrap-multiselect.min.js" integrity="sha256-qoj3D1oB1r2TAdqKTYuWObh01rIVC1Gmw9vWp1+q5xw=" crossorigin="anonymous"></script>

<select id="multiselect" multiple="multiple multiselect" name="project_list" class="jqmsLoaded ms-list-1" style="display: none;">

<option  value="Blue QA">Blue QA</option>

<option value="Easybridge">Easybridge</option>

<option value="K12RS">K12RS</option><option value="LEM">LEM</option>

</select>

Answer 2

$( document ).ready(function() {
   $("#multiselect").prop("selectedIndex", 0);
});

这应该可以工作，因为这设置了选定的索引。在prop()函数中，传递第一个参数来选择索引，第二个参数设置为0now，用于指定<option>要选择的索引。因此您可以在其中传递任何现有的索引号。

Answer 3

尝试下面的代码

$(document).ready(function() {

 $('#multiselect select option:first-child').prop("selected", true);

 $('#multiselect').multiselect('refresh');

});

Answer 4

只需在加载时添加此脚本，如下所示：-

$(function(){

$('#multiselect').multiselect('select', $("#multiselect option:first").val()); 

//second approach 

$("#multiselect").val($("#multiselect option:first").val());

$('#multiselect').multiselect('rebuild');    //important to rebuild if any changes done using script

})