Easyui-Combobox多选下拉框
因为工作需要,引入combobox多选下拉框,并且获取选择的值并以","分开。
效果如下:
代码如下:
1 <html> 2 <head> 3 <title> 4 easyui-combobox多选 5 </title> 6 <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css"> 7 <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"> 8 </script> 9 <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"> 10 </script> 11 </head> 12 <body> 13 <select id="combobox" data-options="multiple:true,panelHeight:'auto'" 14 class="esayui-combobox" style="width:200px;"> 15 <option value="AL"> 16 Alabama 17 </option> 18 <option value="AK"> 19 Alaska 20 </option> 21 <option value="AZ"> 22 Arizona 23 </option> 24 <option value="AR"> 25 Arkansas 26 </option> 27 <option value="CA"> 28 California 29 </option> 30 <option value="CO"> 31 Colorado 32 </option> 33 </select> 34 </body> 35 <script type="text/javascript"> 36 $('#combobox').combobox({ 37 onChange: function() { 38 var value = $('#combobox').combobox('getValues'); 39 console.log(value); 40 console.log(value.join(',')); 41 alert(value); 42 } 43 }); 44 </script> 45 46 </html>