如果你的下拉框選項都是中文，那么下拉搜索時也必須輸入中文才能搜索。如果增加上按拼音及漢字首字母搜索豈不是更方便？

1 引入拼音及首字母轉換js

地址：https://github.com/onionooO/ChineseToPinyinAndInitials

2 修改jquery.searchableSelect.js

搜索“searchableSelectContains”，就在文件開頭第4行。
將代碼：

$.expr[":"].searchableSelectContains = $.expr.createPseudo(function(arg) {return function( elem ) {return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;};});

替換為：

$.expr[":"].searchableSelectContains = $.expr.createPseudo(function(arg) {return function( elem ) {var pinyin = ConvertPinyin($(elem).text());var firstWord = makePy($(elem).text())[0];if($(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0)return true;if(pinyin.toUpperCase().indexOf(arg.toUpperCase()) >= 0)return true;if(firstWord.toUpperCase().indexOf(arg.toUpperCase()) >= 0)return true;return false;};});

搜索效果

在線演示

http://file.dedemao.com/code/html/searchableSelect.html

總結

以上是生活随笔為你收集整理的searchableSelect下拉框插件增加按拼音及首拼搜索的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。