程序中要把一个select改成可以下拉搜索的,就想到了使用下autocomplete.js大概是这么个东西。
问了下同学,推荐我使用Jquery Ui autocomplete,下载下来开始调试使用,终于调好了,但是发现输入字符后无反应。
就完全按照官网实例,写了个数据源发现没问题,然后就感觉应该是数据源的问题,后来想到到源码中找一下,看看插件到底是怎么使用数据源的,找了一会没找到。
很郁闷不知道什么问题,然后就又问了下同学,给我发了一段代码,发现我们两个用的不一样,
function parse(data) {
var parsed = [];
var rows = data.split(
"
"
);
for
(var i =
0
; i < rows.length; i++) {
var row = $.trim(rows[i]);
if
(row) {
row = row.split(
"|"
);
parsed[parsed.length] = {
data: row,
value: row[
0
],
result: options.formatResult && options.formatResult(row, row[
0
]) || row[
0
]
};
}
}
return
parsed;
};
$.extend( $.ui.autocomplete, {
escapeRegex: function( value ) {
return value.replace( /[-[]{}()*+?.,\^$|#s]/g, "\$&" );
},
filter: function( array, term ) {
var matcher = new RegExp( $.ui.autocomplete.escapeRegex( term ), "i" );
return $.grep( array, function( value ) {
return matcher.test( value.label || value.value || value );
} );
}
} );
原来这个这个匹配的地方,使用的属性数据源里面的字段名必须与官网的实例一致。“matcher.test( value.label || value.value || value );”
然后就修改下数据源,然后可以使用了。
但是,写完了,我同学说JQuery UI 的autocomplete是个阉割版,完整版名字叫:jquery.autocomplete.js
一搜索果然是啊,这个版本比jQuery UI的强大很多啊,功能也特别全。害我已经调了那么久了,其实以前用过这个版本,但是一直感觉不正规,就想找个官网可以下载的。
后来发现我在csdn下载过,我以前用的都是这个完整版本,不是阉割版。
JQuery UI 的 autocomplete对jQuery版本还有要求,最后还要写点代码,让两个jQuery版本可以在一个页面出现。
这个详情请百度。
var $jq = jQuery.noConflict(true); 新版本使用完后调用。
大概意思是调用这句话,让$回复成被覆盖的版本。