jquery-chosen.js示例使用方法

## jquery-chosen.js示例使用方法

1. [地址](https://harvesthq.github.io/chosen/) 
2. [CDN](https://cdnjs.com/libraries/chosen)

	<select id="fruit" name="fruit" class="chosen-choices" data-placeholder="单选水果">
		<option value="apple">苹果</option>
		<option value="orange">橘子</option>
		<option value="banana">香蕉</option>
		<option value="pear">梨</option>
	</select>
	<select id="fruits" name="fruits" multiple class="chosen-choices" data-placeholder="多选水果">
		<option value="apple">苹果</option>
		<option value="orange">橘子</option>
		<option value="banana">香蕉</option>
		<option value="pear">梨</option>
	</select>

$(function() {
	// 初始化
	$('.chosen-choices').chosen({
		no_results_text: "没有找到结果！",//搜索无结果时显示的提示
		search_contains:true,   //关键字模糊搜索。设置为true，只要选项包含搜索词就会显示；设置为false，则要求从选项开头开始匹配
		allow_single_deselect:true, //单选下拉框是否允许取消选择。如果允许，选中选项会有一个x号可以删除选项
		disable_search: false, //禁用搜索。设置为true，则无法搜索选项。
		disable_search_threshold: 0, //当选项少等于于指定个数时禁用搜索。
		inherit_select_classes: true, //是否继承原下拉框的样式类，此处设为继承
		width: '100%', //设置chosen下拉框的宽度。即使原下拉框本身设置了宽度，也会被width覆盖。
	});
	
});
	// 取值
	var fruit = $('#fruit').find('option:selected').val(), 
		fruits = $('#fruits').find('option:selected').val();

	// 更新select
	$('#fruit').append('<option value="pitaya">火龙果</option>').trigger('chosen:updated');
	$('#fruits').append('<option value="pitaya">火龙果</option>').trigger('chosen:updated');

选项	描述	取值
--	--	--
no_results_text	无搜索结果显示的文本	文本说明
allow_single_deselect	是否允许取消选择	[true,false]
max_selected_options	当select为多选时，最多选择个数	数字
search_contains	键字模糊搜索。设置为true，只要选项包含搜索词就会显示；设置为false，则要求从选项开头开始匹配	[true,false]
disable_search	禁用搜索。设置为true，则无法搜索选项。	[true,false]
disable_search_threshold	当选项少等于于指定个数时禁用搜索	数字[0]
inherit_select_classes	是否继承原下拉框的样式类，此处设为继承	[true,false]
placeholder_text_single	单选选择框的默认提示信息，当选项为空时会显示。如果原下拉框设置了data-placeholder，会覆盖这里的值	文本
max_shown_results	下拉框最大显示选项数量	数值
single_backstroke_delete	表示按两次删除键才能删除选项，true表示按一次删除键即可删除	[true,false]
case_sensitive_search	搜索大小写敏感	[true,false]
group_search	选项组是否可搜	[true,false]
include_group_label_in_selected	选中选项是否显示选项分组	false不显示，true显示。默认false
width	设置chosen下拉框的宽度。即使原下拉框本身设置了宽度，也会被width覆盖	'100%'或'100px'