jquery mutilselect 插件添加中英文自动补全

jquerymutilselect默认只能根据设置的option来进行自动提示

$.each(availableTags,function(key,value){
$('#channels')
.append($("<option></option>")
.attr("value",value)
.text(value));//默认按text中的value来自动提示
});

阅读下面的需求：

有这么几个选项:

北京

天津

湖北

输入中文的时候控件可以根据输入的中文自动提示，如输入"北"提示北京，但是如果想输入"bei"提示"北京".控件无法完成这个功能，这个时候需要修改源代码，在jquery.multiselect.filter.js文件中，有一个专门来做提示的函数updateCache,找到这个函数的定义

updateCache:function(){
//eachlistitem
this.rows=this.instance.menu.find(".ui-multiselect-checkboxesli:not(.ui-multiselect-optgroup-label)");

//cache
this.cache=this.element.children().map(function(){
varelem=$(this);

//accountforoptgroups
if(this.tagName.toLowerCase()==="optgroup"){
elem=elem.children();
}

returnelem.map(function(){
returnthis.innerHTML.toLowerCase();
}).get();
}).get();
//下面这一段代码是自定义，添加拼音提示功能
if(this.cache.length>0){
for(vari=0;i<this.cache.length;i++){
vartv=this.cache[i];
varletter=tv+cityMap[tv];
if(letter!=undefined){
this.cache[i]=tv+letter;
}
}
}
},

上面的代码就是新增后的代码。新增的代码也就几行。如下

//下面这一段代码是自定义，添加拼音提示功能
if(this.cache.length>0){
for(vari=0;i<this.cache.length;i++){
vartv=this.cache[i];
varletter=tv+cityMap[tv];
if(letter!=undefined){
this.cache[i]=tv+letter;
}
}
}

解释这段代码：

　　this.rows代表的是每一行可选的项目

　　this.cache是一个数组，默认初始化所有option中text到这个数组，在用户输入字符之后，会遍历这个数组，通过正则表达式来匹配，匹配上的元素会自动在前端展示出来。

完整源代码下载：

链接:http://pan.baidu.com/s/1c0AdgI0密码:6lck