chosen.jquery.js 搜索框只能从头匹配的解决思路+方法
来源:互联网 发布:淘宝腾讯视频会员 编辑:程序博客网 时间:2024/06/01 19:02
心急者请直接看下方 总结 ,由于本问题未能找到直接答案,所以只能通过修改源码解决。故将修改源码思路贴出来供大家参考,在遇到其他改源码问题时应如何思考。
chosen.jquery.js(地址:http://harvesthq.github.io/chosen)是一款非常优秀的表单select框美化插件。它提供了一些非常实用的功能。但是在实用中却又有一些问题。
搜索从头匹配问题
首先,我们初始化一个chosen实例:
html:
<select data-placeholder="选择省份..." class="chosen-select" style="width:350px;" tabindex="2"> <option value="">请选择省份</option> <option value="110000" hassubinfo="true">北京</option> <option value="120000" hassubinfo="true">天津</option> <option value="130000" hassubinfo="true">河北省</option> ...</select>
js:
<script type="text/javascript"> $(function(){ $(".chosen-select").chosen(); })</script>
初始化完成后效果如图:
在输入框填入关键词搜索:
可以发现关键词只能从头匹配,因此只搜索出 北京,河北省却未被搜索出。
解决
可以想到上述问题应该是正则匹配的问题,只需找到搜索时的匹配正则并修改,便可以达到我们想要的目的。
通过审查元素可以看到:
插件实例化时有插件内置class:active-result.
所以,打开chosen.jquery.js源码,查找 active-result.
可以发现这个方法,result_add_option,显然是将数据填入新生成的插件select弹出框中的方法。
继续搜索 result_add_option,看看哪里调用了这个方法发现:
明显是生成option对象的方法。
继续搜索,看看在哪里调用:
发现这个方法。在本方法内,可以发现
这便是搜索匹配语句。
console.log(regex);
发现它是从头匹配的正则:
发现源码中挨着regex便定义了正则zregex:
而zregex 便是我们需要的正则。故将插件源码340行 regex 替换成 zregex即可达到目的。
总结
故将插件源码340行 regex 替换成 zregex。或搜索regex定位到如下一行:
将regex 替换成 zregex。 效果:
TO
- chosen.jquery.js 搜索框只能从头匹配的解决思路+方法
- chosen.jquery.js 搜索框实现模糊搜索 chosen-select
- 下拉框搜索功能chosen.jquery.js
- 将select改造成搜索框(chosen.jquery.js)使用
- chosen.jquery.min.js的使用(select下拉框支持首字母搜索)
- jquery.chosen.js实现模糊搜索
- jquery.chosen.js实现模糊搜索
- 去除jquery.chosen.min.js样式的方法
- 如何获取 chosen chosen.jquery.js 选中的值
- 如何获取 chosen chosen.jquery.js 选中的值
- bootstrap-datepicker时间插件和chosen.jquery下拉模糊搜索和bootbox.min弹出框以及jquery.tips提示框和js的全选与取消的使用
- js jquery搜索下拉框 自动选中 搜索到结尾处从头搜索
- jquery-chosen中改变文字匹配模式
- jquery.chosen 强大的jquery模拟下拉框(select)插件
- jquery插件chosen的使用
- jquery-chosen 选择框插件
- jquery-chosen 选择框插件
- jQuery chosen下拉框检索
- java--22--为架包添加javadoc文档
- spring 事务的propagation配置
- easyUI属性汇总
- Java Web开发Tomcat中三种部署项目的方法
- 互联网项目架构之基于服务的分布式架构
- chosen.jquery.js 搜索框只能从头匹配的解决思路+方法
- 书的复制 二分
- Keil5 下Missing Software Packs问题的解决方法
- spark 读取CSV文件
- UVa455 Periodic Strings 周期串AC
- JZ2440开发板使用tftp下载文件出现checksum bad的原因
- HDU1019_Least Common Multiple_GCD
- Ubuntu16配置JDK环境
- 从C#到TypeScrip