jquery.datables过滤封装（一）

用过jQuery.dataTables的都知道该控件提供字段过滤功能。但针对中国用户的话，该过滤存在一个问题，没法根据拼音的首写字母来进行过滤。 
比如某行记录里面存在”主任”，但你在表格中输入的是zr的话却检索不出来。但对于好多用户就会要求输入zr能根据首字母来进行检索，输入中文也能进行检索。 
比如我现在表格数据如下： 

修改前的话，你在搜索框中输入zr则效果就如下了，查询出的数据为空

必须要在搜索框中输入“主任”才能检索出数据

为了达到上面说的效果，我们首先需要做的就是引入2个关键js方法： 
第一步：是判断输入的是中文还是英文

function isChinese(str){var badChar="ABCDEFGHIJKLMNOPQRSTUVWXYZ";badChar+="abcdefghijklmnopqrstuvwxyz";badChar+="0123456789";badChar+=" "+"　";badChar+="`~!@#$%^&()-_=+]\\\\|:;\"\\\'<,>?/";if(""==str){return false}for(var i=0;i<str.length;i++){var c=str.charAt(i);if(badChar.indexOf(c)>-1){return false}}return true}
1
1

第二步是:将中文转换成拼音的方法

function CC2FPY(l1){var l2=l1.length;var I1="";var reg=new RegExp('[a-zA-Z0-9\- ]');for(var i=0;i<l2;i++){var val=l1.substr(i,1);var name=arrayFSearch(val,PinYin);if(reg.test(val)){I1+=val;}else if(name!==false){I1+=name;}};I1=I1.replace(/ /g,'-');while(I1.indexOf('--')>0){I1=I1.replace('--','-');};return I1;}
1
1

第三步：则是修改jquery.datables的源文件的过滤方法。 
找到

function _fnFilter( settings, input, force, regex, smart, caseInsensitive )
1
1

这句话滚动到方法底部。 将display = settings.aiDisplay;后面的代码替换成

var isChineseFlag = isChinese(input);            for (i = display.length - 1; i >= 0; i--) {                if (isChineseFlag) {                    if (!rpSearch.test(settings.aoData[display[i]]._sFilterRow)) {                        display.splice(i, 1);                    }                } else {                    var cc2py = CC2FPY(settings.aoData[display[i]]._sFilterRow).toString().toLowerCase();                    if (!rpSearch.test(cc2py)) {                        display.splice(i, 1);                    }                }            }
1
2
3
4
5
6
7
8
9
10
11
12
13
1
2
3
4
5
6
7
8
9
10
11
12
13

这时候就达到我们的要求了，输入“主任”的首写拼音字母zr可以匹配出相应的中文记录。