jQuery扁平化风格下拉框美化插件FancySelect使用指南
FancySelect是一款小巧实用的jQuery下拉框美化插件。该下拉框美化插件采用扁平化设计风格，是追求时尚的开发者的首选下拉框美化插件之一。
使用方法
HTML结构
FancySelect实用十分简单，它可以和jQuery或Zepto结合使用。在页面中放置一些<select>下拉框组件，然后就可以通过.fancySelect()方法来调用该下拉框插件。如果下拉框中有某个选项没有值，该插件会使用某种占位文字来代替它。
默认情况下，FancySelect在iOS设备上仅使用原生的下拉框和样式。如果你想覆盖它，在下拉框插件初始化的时候设置forceiOS为true即可。
FancySelect也可以通过<select>元素的data-class属性来指定样式，你可以通过这个方法来指定不同样式的select下拉框。
<selectclass="basic"> <optionvalue="">Selectsomething…</option> <option>Lorem</option> <option>Ipsum</option> <option>Dolor</option> <option>Sit</option> <option>Amet</option> </select>
JAVASCRIPT
$('.basic').fancySelect();
更新options
如果你的下拉框的options在插件初始化后被修改了，你可以通过在下拉框上触发update.fs方法来告诉插件更新options列表。
varmySelect=$('.my-select');
mySelect.fancySelect();
mySelect.append('');
mySelect.trigger('update.fs');
启用/禁用下拉框
FancySelect下拉框插件会在初始化后自动将下拉框设置为disabled禁用状态。如果你需要重新设置下拉框的状态，可以在select元素上使用enable.fs或disable.fs方法来修改它们。
<selectclass="my-select"disabled>
<option>FirstOption</option>
<option>SecondOption</option>
</select>
varmySelect=$('.my-select');
mySelect.fancySelect();//currentlydisabledbecauseofhtmlproperty
//later…
mySelect.trigger('enable.fs');//nowenabled
//evenlater…
mySelect.trigger('disable.fs');//nowdisabledagain
如果你需要制作一些个性效果，可以使用triggerTemplate和triggerTemplate方法，它们都是通过option选项来返回一个HTML字符串：
<selectclass="bulbs">
<optiondata-icon="old">Incandescent</option>
<optiondata-icon="curly">CFL</option>
<optiondata-icon="work">Halogen</option>
</select>
$('.bulbs').fancySelect({
optionTemplate:function(optionEl){
returnoptionEl.text()+'
';}})
你可以在<select>下拉框框选项改变的时候监听change.fs事件：
<selectclass="my-select"disabled>
<option>FirstOption</option>
<option>SecondOption</option>
</select>
varmySelect=$('.my-select');
mySelect.fancySelect().on('change.fs',function(){
$(this).trigger('change.$');
});//triggertheDOM'schangeeventwhenchangingFancySelect