1 <div class="myselect1 mt10 ml10">
 2     <select id="select1" class="myselect">
 3         <option value="1">中国</option>
 4         <option value="2">美国</option>
 5         <option value="3">韩国</option>
 6     </select>
 7     <span>下拉框1</span>
 8 </div>
 9 <div class="myselect2 mt10 ml10">
10     <select id="select2" class="myselect">
11         <option value="1">北京</option>
12         <option value="2">华盛顿</option>
13         <option value="3">首尔</option>
14     </select>
15     <span>下拉框2</span>
16 </div>

 1 (function(win, $) {
 2
 3      // 初始化下拉框
 4     $("select").chosen({
 5         disable_search: true
 6     }).change(function(event, opt) {
 7         // 获取选中的值
 8         var val = $(this).find("option:selected").html();
 9         console.log(val);
10     });
11 }(this, jQuery));

/*两个框的宽度是通过这样直接指定的方式设定的*/
.myselect1 select {width: 100px;
}
.myselect2 select {width: 150px;
}/*#region 重写下拉框 */
/*两个下拉框的相同样式直接重写*//*整个框外观上的样式*/
.chosen-container
{margin-right: 100px;float: left;text-align: center;*padding: 5px 0;
}.chosen-container .chosen-results
{padding: 0;margin-right: 0;
}
/*下拉框的那个框的样式*/
.chosen-container-single .chosen-single
{background: #f9f9f9;border: 0;border-radius: 0;box-shadow: none;　　/*后来的测试中发现，这个height是包括边框的高度*/　  line-height: 36px;height: 36px;
}.chosen-container-single .chosen-single span
{margin-right: 26px;letter-spacing: 2px;margin-left: 4px;
}
/*下拉项*/
.chosen-container .chosen-results li
{letter-spacing: 4px;
}.chosen-container-single .chosen-single div
{padding: 0;width: 21px;
}
/*图标*/
.chosen-container-single .chosen-single div b
{background: url(../images/bg.png) no-repeat left 15px;
}.chosen-container-active.chosen-with-drop .chosen-single div b
{background: url(../images/bg.png) no-repeat left 15px;
}
/*当下拉项显示出来时下拉框的那个框的样式*/
.chosen-container-active.chosen-with-drop .chosen-single
{background: #f9f9f9;box-shadow: none;border: 0;border-radius: 0;
}.chosen-container-single .chosen-drop
{border: 1px solid #f9f9f9;background-color: #f9f9f9;box-sizing: border-box;
}.chosen-container .chosen-results li.highlighted
{background-color: #397ddb;background-image: none;
}
/*给其中一个框分别指定个性的样式，另一个框的样式设定方式同理，使用父选择器进行限制*/
.myselect1 .chosen-container
{text-align: left;
}
.myselect1 .chosen-container-single .chosen-single {background-color: #f00;color: #fff;font-size: 20px;
}
.myselect1 .chosen-container .chosen-results li
{letter-spacing: 0;padding-left: 12px;
}
.myselect1 .chosen-container-active.chosen-with-drop .chosen-single
{background: #0f0;border: 1px solid #f00;
}