chosen插件的使用

Chosen 是一個支援jquery的select下拉框美化插件，還增加了自動篩選的功能。

如何使用chosen插件

1.chosen是jquery插件，是以一定要先引入jquery

順序（chosen的css檔案，jquery的js檔案，chosen的js檔案）

從網站下載下傳chosen源碼：

2.頁面代碼：寫在select标簽下！

這裡是設定select可以多選，要添加multiple屬性！

<select  multiple="multiple" id="userNameWin" class="form-control chzn-select">請選擇組員 </select>
           

3.js代碼

function(data){
//          var option="<option value="+""+">請選擇組員</option>";
            var option="";
            for(i=;i<data.total;i++){
                option += "<option value="+data.rows[i].keyObj+">"
                +data.rows[i].valueObj+"</option>";
            }
            $("#userNameWin").html(option);
            $("#userNameWin").chosen({
                search_contains:true,
                no_results_text:'沒有該成員！',
                max_selected_options:,//最多可選擇的個數（多選時使用）
                disable_search_threshold:
            });
            $("#userNameWin_chosen").find("input").attr('placeholder','請選擇組員');

            $("#userNameWin").bind("chosen:maxselected",function (e) {
                $.xalert({title:'提示',msg:'最多隻能選擇兩名組員！'});
                return;//超出最大選擇個數的提示
            });
}
           

這是擷取chosen選擇值的代碼

var userIds =$("#userNameWin").find("option:selected").val();//單選時
var userIds =$("#userNameWin").val();//多選取值
           

一些參數：