使用切片功能限制结果自动完成 jquery ui答案

【问题标题】：Limit results autocomplete jquery ui with slice function使用切片功能限制结果自动完成 jquery ui
【发布时间】：2012-10-08 17:47:30
【问题描述】：

我需要在这个自动完成 jquery ui 脚本中限制结果（最多 10 个）。我知道我必须使用 slice 函数，但我无法将其正确放置在脚本中。提前感谢您的帮助。

$(document).ready(function() {
    var myArr = [];

    $.ajax({
        type: "GET",
        url: "events.xml", // change to full path of file on server
        dataType: "xml",
        success: parseXml,
        complete: setupAC,
        failure: function(data) {
            alert("XML File could not be found");
            }
    });

    function parseXml(xml)
    {
        //find every query value
        $(xml).find("topevent").each(function()
        {
            //you are going to create an array of objects 
        var thisItem = {}; 
        thisItem['label'] = $(this).attr("label"); 
        thisItem['value'] = $(this).attr("value");
        myArr.push(thisItem); 

        }); 
    }

    function setupAC() {
    $("input#searchBoxEv").autocomplete({
    source: myArr,
    minLength: 3,
    select: function(event, ui) {
    var urlString = "http://mysite.com/" +  "eventi/" + (ui.item.value) + ".html";
    $("input#searchBoxEv").val(urlString);
    location.href=urlString;

                           }
    });
}
});

【问题讨论】：

尝试使用css高度并将溢出设置为滚动
我按照您的建议使用了 css（高度和最大高度），但使用巨大的 xml 文件并不是最好的解决方案。

标签： jquery autocomplete limit slice

【解决方案1】：

$("#auto").autocomplete({
    source: function(request, response) {
        var results = $.ui.autocomplete.filter(myarray, request.term);

        response(results.slice(0, 10));
    }
});

您可以在此处找到更多文档..

http://jqueryui.com/autocomplete/

【讨论】：

我已经看过这个文档，但是我不能在我的脚本中包含函数 slice。

【解决方案2】：

最后我解决了在 jquery.ui css 中添加两个参数的问题：最大高度和溢出：隐藏。自动完成初始化为 3° 字母，为了获得更好的结果，人们必须输入更多。它适用于五种不同的浏览器（IE、Chrome、Opera、Firefox、Safari）。

.ui-autocomplete { 位置：绝对；光标：默认；文本对齐：左；最大高度：245px；溢出：隐藏； }

【讨论】：

就像 Xavier 说的：stackoverflow.com/questions/7617373/… 但也许您的解决方案也可以提供帮助。此外，如果您的源 myarray 是 SQL 查询的结果，您可以限制查询结果的行。例如 MySQL 中的 [limit ]
或者更好地使用 query->setMaxResults(n) 和你的 ORM。