JQuery multiselect – 在多选下拉列表中select一个值
我有一个多选下拉如下
<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]的数组值。 我应该遍历数组，并使选定的值（checkbox相应的ID应检查）。 请帮忙。
//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");
谢谢大家的答案。
以你的答案为准则，我用下面的代码解决了这个问题：
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"); }
再次感谢您的支持。
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); }
这里是一个演示
这应该是这样简单的：
<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/
该代码应该有所帮助：
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); }
从一个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");
官方网站提到（在“手动检查或取消选中checkbox？”部分）只是使用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>
var valArr = ["1","2","3"]; /* Below Code Matches current object's (ie 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(); });
这将select值与数组中的值匹配的选项。
$("#dropDownId").val(["130860","130858"]); $("#dropDownId").selectmenu('refresh');
这是我的代码示例。 我用逗号分隔多个select下拉列表中的数字，并希望从逗号分隔值中select多个选项的选项。
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); } } });
这是从我使用数组作为input工作。 首先取消所有选项，然后点击使用jqueryselect的选项
var dimensions = ["Dates","Campaigns","Placements"]; $(".input-dimensions").multiselect("uncheckAll"); for( var dim in dimensions) { $(".input-dimensions").multiselect("widget") .find(":checkbox[value='" + dimensions[dim] + "']").click(); }
我最终不得不通过在点击事件发生后设置被选中的道具来使用input元素上的点击事件进行轻微的改变。
$(y.Ctrl).multiselect("widget").find(":checkbox").each(function () { if ($.inArray(this.value, uniqueVals) != -1) { $(this).click(); $(this).prop('checked', true); } });
为我工作好，根据你的要求更换ID。
$("#FormId select#status_id_new").val(''); $("#FormId select#status_id_new").multiselect("refresh");
我从jquery-multiselect文档中得到了更好的解决scheme。
var data = [101,102]; $("#data").multiSelect('deselect_all'); $("#data").multiSelect("select",data);
你可以试试这个：
$( "#data" ).val([ "100", "101" ]);
