我正在使用 jQuery UI 自动完成功能。
$("#task").autocomplete({
max:10,
minLength:3,
source: myarray
});
max 参数不起作用，我仍然得到超过 10 个结果。我错过了什么吗？
【问题讨论】：
max的选项
标签： jquery-ui autocomplete jquery-ui-autocomplete
这是 jQueryUI 小部件的proper documentation。没有用于限制最大结果的内置参数，但您可以轻松完成：
$("#auto").autocomplete({
source: function(request, response) {
var results = $.ui.autocomplete.filter(myarray, request.term);
response(results.slice(0, 10));
}
});
您可以为source 参数提供一个函数，然后在过滤后的数组上调用slice。
【讨论】：
您可以将minlength 选项设置为某个较大的值，或者您可以像这样通过 css 进行设置，
.ui-autocomplete { height: 200px; overflow-y: scroll; overflow-x: hidden;}
【讨论】：
就像“Jayantha”所说的使用 css 是最简单的方法，但这可能会更好，
.ui-autocomplete { max-height: 200px; overflow-y: scroll; overflow-x: hidden;}
请注意，唯一的区别是“最大高度”。这将允许小部件调整到较小的高度，但不超过 200 像素
【讨论】：
添加到Andrew's answer，您甚至可以引入 maxResults 属性并以这种方式使用它：
$("#auto").autocomplete({
maxResults: 10,
source: function(request, response) {
var results = $.ui.autocomplete.filter(src, request.term);
response(results.slice(0, this.options.maxResults));
}
});
jsFiddle：http://jsfiddle.net/vqwBP/877/
这应该有助于代码的可读性和可维护性！
【讨论】：
这是我用的
.ui-autocomplete { max-height: 200px; overflow-y: auto; overflow-x: hidden;}
溢出自动，因此滚动条在不应该显示时不会显示。
【讨论】：
我可以通过在我的 CSS 文件中添加以下内容来解决这个问题：
.ui-autocomplete {
max-height: 200px;
overflow-y: auto;
overflow-x: hidden;
}
【讨论】：
如果结果来自mysql查询，直接限制mysql结果效率更高：
select [...] from [...] order by [...] limit 0,10
其中 10 是您想要的最大行数
【讨论】：
我是通过以下方式做到的：
success: function (result) {
response($.map(result.d.slice(0,10), function (item) {
return {
// Mapping to Required columns (Employee Name and Employee No)
label: item.EmployeeName,
value: item.EmployeeNo
}
}
));
【讨论】：
jQuery 允许您在将自动完成附加到输入时更改默认设置：
$('#autocomplete-form').autocomplete({
maxHeight: 200, //you could easily change this maxHeight value
lookup: array, //the array that has all of the autocomplete items
onSelect: function(clicked_item){
//whatever that has to be done when clicked on the item
}
});
【讨论】：
插件： jquery-ui-autocomplete-scroll 带有滚动条和限制的结果很漂亮
$('#task').autocomplete({
maxShowItems: 5,
source: myarray
});
【讨论】：
我已经尝试了上述所有解决方案，但我的方法只适用于：
success: function (data) {
response($.map(data.slice (0,10), function(item) {
return {
value: item.nome
};
}));
},
【讨论】：
【讨论】：
在我的情况下，这很好用：
source:function(request, response){
var numSumResult = 0;
response(
$.map(tblData, function(rowData) {
if (numSumResult < 10) {
numSumResult ++;
return {
label: rowData.label,
value: rowData.value,
}
}
})
);
},
【讨论】：
我要把这个留给任何使用这个库的人
JavaScript-autoComplete/1.0.4/auto-complete.js
这可能会有所帮助，因为演示版没有显示如何限制结果。基于 Andrew 的回复。
new autoComplete({
selector: 'input[name="name_of_searchbox"]',
minChars: 1,
source: function(term, suggest){
term = term.toLowerCase();
var choices = [];
var matches = []; //For Pushing Selected Terms to be always visible, can be adapter later on based on user searches
for (i=0; i<choices.length; i++)
if (~choices[i].toLowerCase().indexOf(term)) matches.push(choices[i]);
suggest(matches.slice(0,10));
}
});
希望这对任何人都有用。 干杯！
【讨论】：