jQuery自动完成以找到完全匹配

-1

我有一个机场的jQuery自动完成。我的数据集包含标签和值。样品：jQuery自动完成以找到完全匹配

var Airports = [ 
    { "label": "DMB - Dzhambyl, Dzhambyl Airport", "value": "DMB" }, 
    { "label": "EMA - Nottingham, Nottingham East Midlands Airport", "value": "EMA" }, 
    { "label": "HAM - Hamburg, Hamburg Airport", "value": "HAM" }  
];

当我进入HAM（这是3LC汉堡机场）目前，我得到所有这三个项目的结果。但是，如果此商品的价值与确切的搜索请求相匹配，我只想看到“汉堡 - 汉堡机场”。应该也可以找到所有的条目，例如“burg”在里面，如果我要搜索的话。

演示：https://jsfiddle.net/SchweizerSchoggi/pguoa197/1/

来源

2016-07-01 SchweizerSchoggi

在jQuery的自动完成API文档http://api.jqueryui.com/自动完成/有一个示例显示如何从文本的开头进行匹配。 –

是的，但两者都应该是可能的。如果我使用“从文本开始搜索”比我会发现汉堡汉堡，但没有在文本中间的“伯格”的条目，如果我要搜索该 – SchweizerSchoggi

所以，你想匹配的值，如果它是一个确切的命中，否则在文字上匹配？在这种情况下，修改源函数以提供该行为。 –

不知道是谁下投这个问题，为什么...但这里是解决方案谁以往任何时候都需要在今后类似的事情：

$(function() { 
    var Airports = [ 
     { "label": "DMB - Dzhambyl, Dzhambyl Airport", "value": "DMB" }, 
     { "label": "EMA - Nottingham, Nottingham East Midlands Airport", "value": "EMA" }, 
     { "label": "HAM - Hamburg, Hamburg Airport", "value": "HAM" }  
    ]; 


$("#depart").autocomplete({ 
    source: function (request, response) { 
     var term = $.ui.autocomplete.escapeRegex(request.term) 
      , startsWithMatcher = new RegExp("^" + term, "i") 
      , startsWith = $.grep(Airports, function(value) { 
       return startsWithMatcher.test(value.label || value.value || value); 
      }) 
      , containsMatcher = new RegExp(term, "i") 
      , contains = $.grep(Airports, function (value) { 
       return $.inArray(value, startsWith) < 0 && 
        containsMatcher.test(value.label || value.value || value); 
      }); 

      response(startsWith.concat(contains)); 
    }, 
    minLength: 3 
    }); 
});

工作示例：https://jsfiddle.net/SchweizerSchoggi/pguoa197/5/

来源

2016-07-04 09:03:00 SchweizerSchoggi

我不明白这是一个修复程序，因为它显示与问题中的代码完全相同的结果。如果您只想将列表中的“HAM”向上移动，您可以指定自定义排序。 –

这不一样。当你进入HAM时，汉堡现在首先出现（匹配3LC），然后是其余的。在最初的样本中，汉堡仅在pos 3上 – SchweizerSchoggi

在这种情况下，您只需要实施自定义排序。您的问题意味着您只想过滤第一个字符 - “但是如果此商品的价值与确切的搜索请求匹配，我只想看到”汉堡 - 汉堡机场“ –

从您的问题描述，这听起来像你只想从值字符串的开头相匹配。在这种情况下你可以创建自己的过滤方法为自动完成，像这样：

$.ui.autocomplete.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); 
    }); 
};

Updated fiddle

来源

2016-07-01 16:24:41

Thx Rory，汉堡（火腿）这工作正常但它也应该可以找到，例如“诺丁汉”，现在不再是这种情况了 – SchweizerSchoggi

恐怕是一个或另一个，'ham'是两个字符串的有效部分，因此在搜索时会显示。 –

它现在可以工作，看到我的答案上面:-) – SchweizerSchoggi

jQuery自动完成以找到完全匹配

回答

相关问题