57

我正在使用 Boostrap Multiselect 插件(http://davidstutz.de/bootstrap-multiselect/)进行多选下拉菜单,如下所示

<select id="data" name="data" class="data" multiple="multiple">
  <option value="100">foo</option>
  <option value="101">bar</option>
  <option value="102">bat</option>
  <option value="103">baz</option>
</select>

在页面加载时,我将得到一个值数组,如 [101,102]。我应该遍历数组并选择值(应选中对应于 id 的复选框)。请帮忙。

4

17 回答 17

157
//Do it simple

var data="1,2,3,4";

//Make an array

var dataarray=data.split(",");

// Set the value

$("#multiselectbox").val(dataarray);

// Then refresh

$("#multiselectbox").multiselect("refresh");
于 2012-06-17T06:40:07.307 回答
25

谢谢大家的答案。

以你所有的答案为指导,我用下面的代码解决了这个问题:

var valArr = [101,102];
i = 0, size = valArr.length;
for(i; i < size; i++){
  $("#data").multiselect("widget").find(":checkbox[value='"+valArr[i]+"']").attr("checked","checked");
  $("#data option[value='" + valArr[i] + "']").attr("selected", 1);
  $("#data").multiselect("refresh");
}

再次感谢大家的支持。

于 2011-08-09T12:01:27.717 回答
20

它应该像这样简单:

<select id='multipleSelect' multiple='multiple'>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
<script type='text/javascript'>
    $('#multipleSelect').val(['1', '2']);
</script>

检查我的小提琴:https ://jsfiddle.net/luthrayatin/jaLygLzo/

于 2016-06-14T02:30:51.540 回答
10
var valArr = [101,102], // array of option values
    i = 0, size = valArr.length, // index and array size declared here to avoid overhead
    $options = $('#data option'); // options cached here to avoid overhead of fetching inside loop

// run the loop only for the given values
for(i; i < size; i++){
    // filter the options with the specific value and select them
    $options.filter('[value="'+valArr[i]+'"]').prop('selected', true);
}

这是一个演示

于 2011-08-06T11:04:09.057 回答
5

对我来说工作正常,根据您的要求更改 ID。

$("#FormId select#status_id_new").val('');
 $("#FormId select#status_id_new").multiselect("refresh");
于 2017-01-25T14:16:59.980 回答
4

该代码应该有帮助:

var selected=[101,103];
var obj=$('#data');
for (var i in selected) {
    var val=selected[i];
    console.log(val);
   obj.find('option:[value='+val+']').attr('selected',1);
}
于 2011-08-06T11:00:55.417 回答
4

从一个php数组到多选...

$PHP_array=array();           // create array anyway you need to in PHP
array_push($PHP_array,20);    // Single ID values
array_push($PHP_array,22);

$javascript_str = json_encode($PHP_array);   // JSON ENCODE        

// 然后在 JS 脚本中

$("#multiselectbox").val(<?php echo $javascript_str; ?>);

// Then refresh

$("#multiselectbox").multiselect("refresh");
于 2015-03-31T23:08:05.210 回答
2
 var valArr = ["1","2","3"];

/* Below Code Matches current object's (i.e. option) value with the array values */
 /* Returns -1 if match not found */
 $("select").multiselect("widget").find(":checkbox").each(function(){
    if(jQuery.inArray(this.value, valArr) !=-1)
            this.click();

   });

这将选择其值与数组中的值匹配的选项。

于 2013-02-14T11:23:01.697 回答
2

官方网站已经提到(在“手动检查或取消选中复选框?”部分)只是为了使用 click()

例如

$("#ddl_singleSelect")
    .multiselect("widget")
        .find(":radio[value='']").click();  // change displayed selectedText
$("#ddl_singleSelect option[value='']")
    .prop("selected", true)             // change val()
    .trigger("change");                 // fire change event


$("#ddl_multiselect").multiselect("uncheckAll");    // init by de-selecting all
$("#ddl_multiselect")
    .multiselect("widget")
        .find(     ":checkbox[value='1']"
                + ",:checkbox[value='2']"
                + ",:checkbox[value='3']"
                + ",:checkbox[value='4']"
            ).click();  // change displayed selecetdText
$("#ddl_multiselect")
    .find(     "option[value='1']"
            + ",option[value='2']"
            + ",option[value='3']"
            + ",option[value='4']"
        ).prop("selected", true);   // change val()
$("#ddl_multiselect").trigger("change");    // fire change event

或通过HTML

<select name="example-presets" multiple="multiple" size="5">
    <option value="option1" selected="selected">Option 1</option>
    <option value="option2">Option 2</option>
    <option value="option3" selected="selected">Option 3</option>
    <option value="option4" selected="selected">Option 4</option>
    <option value="option5" disabled="disabled">Option 5</option>
    <option value="option6" disabled="disabled">Option 6</option>
    <option value="option7">Option 7</option>
    <option value="option8">Option 8</option>
    <option value="option9">Option 9</option>
</select>
....
<script type="text/javascript">$("select").multiselect();</script>
于 2016-03-17T03:15:37.247 回答
2

我从jquery-multiselect 文档中得到了更好的解决方案。

var data = [101,102];

$("#data").multiSelect('deselect_all');

$("#data").multiSelect("select",data);
于 2017-04-19T12:53:26.597 回答
0
$("#dropDownId").val(["130860","130858"]);
$("#dropDownId").selectmenu('refresh');
于 2013-05-09T06:28:38.843 回答
0

这是我的代码示例。我有用于多选下拉列表的逗号分隔数字,并希望从逗号分隔值中选择多个选项。

var selected_tags_arr = new Array();
var selected_tags = 1,2,4;
selected_tags_arr = selected_tags.split(",");
$('#contact_tags option').each(function (){
    var option_val = this.value;
    for (var i in selected_tags_arr) {
        if(selected_tags_arr[i] == option_val){
            $("#contact_tags option[value='" + this.value + "']").attr("selected", 1);
        }
    }
});
于 2014-01-15T11:27:26.277 回答
0

这就是我使用数组作为输入的方法。首先取消选中所有选项,然后单击使用 jquery 选择的选项

var dimensions = ["Dates","Campaigns","Placements"];

$(".input-dimensions").multiselect("uncheckAll");

for( var dim in dimensions) {
  $(".input-dimensions").multiselect("widget")
    .find(":checkbox[value='" + dimensions[dim] + "']").click();
}
于 2014-01-23T19:31:20.927 回答
0

我最终不得不通过在触发点击事件后设置选中的道具来使用输入元素上的点击事件进行轻微更改。

$(y.Ctrl).multiselect("widget").find(":checkbox").each(function () {
    if ($.inArray(this.value, uniqueVals) != -1) {
        $(this).click();
        $(this).prop('checked', true);
    }
});
于 2015-10-21T19:47:20.643 回答
0

我希望这些功能对您有所帮助。

$('#your-select').multiSelect('select', String|Array);

$('#your-select').multiSelect('deselect', String|Array);

$('#your-select').multiSelect('select_all');

$('#your-select').multiSelect('deselect_all');

$('#your-select').multiSelect('refresh');

本站参考参考资料

于 2018-11-06T12:33:22.653 回答
0

按其值选择选项。也可以使用一组值。查找完整的详细信息http://davidstutz.github.io/bootstrap-multiselect/#methods

$('#example-select').multiselect('select', ['1', '2', '4']); 
于 2020-12-25T07:58:32.790 回答
-3

你可以试试这个:

$( "#data" ).val([ "100", "101" ]);
于 2016-11-26T08:07:08.457 回答