在使用select單選框的時候，有時候需要配合後臺傳遞的資料設定預設值。這時候需要js來設定select單選框的預設值。

比如我們定義瞭如下的單選框

<select name="locus" id="selected"  class="form-control">
                        <option>--</option>
                        <option value="DG">DG</option>
                        <option 
 
value="CA">CA</option>
                        <option value="HK">HK</option>
                        <option value="DG,CA">DG&CA</option>
                        <option value="DG,HK">DG&HK</option>
                        <option value="HK,CA">
 
HK&CA</option>
                        <option value="HK,CA,DG">HK&CA&DG</option>
                        <option value="ALL USER">ALL USER</option>
                    </select>

然後傳輸資料的使用ModelAndView將資料從後臺傳遞到前端。可以用jstl表示式獲取到值。

設定預設值的js程式碼：

$(function
 
(){
        var selectValue='${locus}';//${locus}是後臺通過ModelAndView.add("locus",value)
        var select=document.getElementById("selected");//獲取到單選框的位置
        var options=select.options;//獲取單選框的選項
        for(var i=0;i<options.length;i++){//遍歷單選框選項
            if(options[i].value==selectValue)
                options[i].setAttribute("selected",true);//找到匹配的選項，設定成已選擇
        }
    })

多選框設定預設值的程式碼其實和單選差不多。

$(function(){
        var selectedArray='${statucode}';//獲取到預設值
        var Array = selectedArray.split(",");//以,將selected字元創切割成字串陣列
        var mulselect=document.getElementById("ms");//找到複選框的位置
        var muloptions=mulselect.options;//獲取複選框的選擇項
        for(var j=0;j<selectedArray.length;j++) {
            for (var i = 0; i < muloptions.length; i++) {
                if (muloptions[i].value == Array[j]) {
                    muloptions[i].setAttribute("selected",true)//遍歷字串陣列和複選框選擇項，當有匹配的，就把該選項設定成已選擇
                }
            }
        }
    });

然後在初始化multil-select。這裡採用的的是bootstrap-multilselect。