searchableSelect下拉框插件增加按拼音及首拼搜索

织梦猫dedemao

于 2018-12-17 17:08:19 发布

阅读量1k

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/jason19905/article/details/85052309

版权

js 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

如果你的下拉框选项都是中文，那么下拉搜索时也必须输入中文才能搜索。如果增加上按拼音及汉字首字母搜索岂不是更方便？

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;
    };
  });