Javascript 如何在“自动完成”中更改结果过滤器?
我希望通过正则表达式选择结果,而不是进行文本匹配Javascript 如何在“自动完成”中更改结果过滤器?,javascript,jquery,jquery-ui,autocomplete,jquery-ui-autocomplete,Javascript,Jquery,Jquery Ui,Autocomplete,Jquery Ui Autocomplete,我希望通过正则表达式选择结果,而不是进行文本匹配 我是否可以覆盖Autocomplete的默认行为来完成此操作,或者我是否需要一个替代结构?我创建了一个示例,其中仅呈现标签中包含字符串“jQuery”的结果: var projects = [ { value: "jquery", label: "jQuery", desc: "the write less, do more, JavaScript library", icon: "jquery_32x32
我是否可以覆盖Autocomplete的默认行为来完成此操作,或者我是否需要一个替代结构?我创建了一个示例,其中仅呈现标签中包含字符串“jQuery”的结果:
var projects = [
{
value: "jquery",
label: "jQuery",
desc: "the write less, do more, JavaScript library",
icon: "jquery_32x32.png"},
{
value: "jquery-ui",
label: "jQuery UI",
desc: "the official user interface library for jQuery",
icon: "jqueryui_32x32.png"},
{
value: "sizzlejs",
label: "Sizzle JS",
desc: "a pure-JavaScript CSS selector engine",
icon: "sizzlejs_32x32.png"}
];
$("input").autocomplete({
source: projects
}).data("autocomplete")._renderItem = function(ul, item) {
// this is where you can implement your regex
if (item.label.indexOf("jQuery") !== -1) {
return $("<li></li>").data("item.autocomplete", item).append("<a>" + item.label + "<br>" + item.desc + "</a>").appendTo(ul);
}
};
var项目=[
{
值:“jquery”,
标签:“jQuery”,
desc:“写得少,做得多,JavaScript库”,
图标:“jquery_32x32.png”},
{
值:“jquery ui”,
标签:“jQueryUI”,
desc:“jQuery的官方用户界面库”,
图标:“jqueryui_32x32.png”},
{
值:“sizzlejs”,
标签:“Sizzle JS”,
desc:“一个纯JavaScript CSS选择器引擎”,
图标:“sizzlejs_32x32.png”}
];
$(“输入”)。自动完成({
资料来源:项目
}).数据(“自动完成”)。\u renderItem=功能(ul,项目){
//这是您可以实现正则表达式的地方
if(item.label.indexOf(“jQuery”)!=-1){
返回$(“”)数据(“item.autocomplete”,item)。追加("你可以覆盖jQueryUI的自动完成默认行为。在你的控制器中,你应该编写服务器端逻辑来生成结果集。默认情况下,JQueryAutComplete使用q
作为参数。使用它你可以得到值并生成结果集,结果集将是一个列表。我想这会给你一个想法。AutocComplete只在每个按键存储上显示结果。您应该注意显示逻辑。有一种内置的方法可以做到这一点:只需为autocomplete小部件中的选项提供一个功能:
var items = ['Foo', 'Bar', 'Hello', 'Goodbye', '1234'];
$("#autocomplete").autocomplete({
source: function(request, response) {
// The term the user searched for;
var term = request.term;
// Extract matching items:
var matches = $.grep(items, function(item, index) {
// Build your regex here:
return /\d+/.test(item);
});
// let autocomplete know the results:
response(matches);
}
});
注意,由于我使用的是简单的正则表达式,所以这个示例总是返回“1234”。更有用的可能是基于这个术语(也可能)构建正则表达式
这实际上与小部件本身过滤结果的方式非常相似。请查看filter函数,并查看如果您提供数组作为源
选项,它是如何调用的。@user474632:没问题,很高兴提供帮助!