select chosen 的入門使用

首先要引用

因為肯定要引用jq,所以就沒有寫啦

<link rel="stylesheet" href="__ROOT__/Public/jschy/chosen_v1.8.7/chosen.min.css">
<script src="__ROOT__/Public/jschy/chosen_v1.8.7/chosen.jquery.js" type="text/javascript"></script>
<script type="text/javascript" src="__ROOT__/Public/jschy/chosen_v1.8.7/chosen.jquery.js"></script>

然后 是 主體 select

<select id="keylist" data-placeholder="Choose a Country..." multiple class="my-chosen-select">
 <option value="1">United States</option>
 <option value="2">United Kingdom</option>

</select>

class 是主要的.js是根據這個class="my-chosen-select" 來找到這個元素

multiple  代表可以多選
初始化

//初始化插件 chosen
$(".my-chosen-select").chosen({
 width: "100%", //寬度
 search_contains:true//模糊搜索開啟
});

.my-chosen-select就是之前class設置的

初始化放到最后面就行

選中多個

$("#keylist option[value='2']").attr("selected",true);

$("#keylist").trigger("chosen:updated");//更新

keylist 是select 的id ;
需要更新才能生效

獲取 選中的值

$("#keylist").val()
keylist是select 的id