[Ext插件]PinyinFilter：使用拼音首字母对数据进行过滤

这个插件的目的在于提高用户对于数据的选择效率。经常录入数据的人肯定能明白，在一长串列表中选择你想要记录是一件很费眼神的事；记得当初玩开心网可以按拼音首字母找到自己的好友，当时就觉得很是方便。如果您想提高用户对您软件的评价，请您考虑这个插件。


实现原理：重写了Store中返回过滤函数的方法，使其中需要过滤的汉字转换为其拼音首字母数组（因为有多音字，数组内每一项对应一种拼音的可能性），遍历数组每一项与当前输入项生成的前端匹配正则表达式进行比对，有一个满足就返回true，都不满足返回false

附件有示例

/**
 * 修改组件内部Store的createFilterFn方法，使其按照拼音首字母进行过滤
 *
 * 1.0.1修改：
 * 修复了多音字筛选不到的bug
 *
 * 1.0.2修改：
 * 为store添加了一个拼音的缓存
 * 
 * @author [e-mail]
 * @version 1.0.2
 * @createTime 2010-04-18 23:12:31
 */
Ext.ns("Ext.ux");

Ext.ux.PinyinFilter=function(){
    //主要方法，由字符串生成拼音首字母
    function makePy(str){
	if(typeof(str) != "string"){
		return str;
	}
	var arrResult = new Array();
	for(var i=0,len=str.length;i<len;i++){
		var ch = str.charAt(i);
		arrResult.push(checkCh(ch));
	}
	var resarr = mkRslt(arrResult);
	return resarr;
    }
    
    function checkCh(ch){
        var uni = ch.charCodeAt(0);
        if(uni > 40869 || uni < 19968)
            return ch; //dealWithOthers(ch);
        return (oMultiDiff[uni]?oMultiDiff[uni]:(strChineseFirstPY.charAt(uni-19968)));
    }
    
    function mkRslt(arr){
        var arrRslt = [""];
        for(var i=0,len=arr.length;i<len;i++){
            var str = arr[i];
            var strlen = str.length;
            if(strlen == 1){
                for(var k=0;k<arrRslt.length;k++){
                    arrRslt[k] += str;
                }
            }else{
                var tmpArr = arrRslt.slice(0);
                arrRslt = [];
                for(k=0;k<strlen;k++){
                    var tmp = tmpArr.slice(0);
                    for(var j=0;j<tmp.length;j++){
                        tmp[j] += str.charAt(k);
                    }
                    arrRslt = arrRslt.concat(tmp);
                }
            }
        }
        return arrRslt;
    }
    
    var strChineseFirstPY =  【太长，此处省略】
    var oMultiDiff=【太长，此处省略】
    //重写生成过滤方法的方法
    function createFilterFn(property, value, anyMatch, caseSensitive){
        if(Ext.isEmpty(value, false)){
            return false;
        }
        value = this.data.createValueMatcher(value, anyMatch, false);
        return function(r){
	    var os = r.data[property],arr;
	    if(this.pyCache[os]){
		arr = this.pyCache[os];
	    }
	    else{		
		arr = makePy(os);
		this.pyCache[os] = arr;
	    }	    
	    for(var i=0;i<arr.length;i++){
		if(value.test(arr[i])){
		    return true;
		}
	    }
            return false;
        };
    }
  
  return{
        init:function(c){
	    var s=c.store;
            s.createFilterFn = createFilterFn;//覆盖原方法
	    s.pyCache = {};//拼音缓存，汉字字符串与其拼音数组的映射
        }
    }
}()

评论

2 楼 cencai09 2011-03-02  

很好的实例，顶！！！！！！

1 楼 luojun1982_2001 2010-12-02  

值得学习研究，顶一个！