Question

我正在尝试将jQuery UI自动完成扩展为类似于Google的搜索字段，其中顶部建议结果中的剩余文本（即任何不是request.term）将添加到用户输入的字符串末尾用不同的颜色。

我原本打算通过使用相对定位在原始输入后面放置一个相同大小的透明div来完成此操作，并且顶部匹配的结果以较浅的颜色放置在此div中。

我的问题是，访问匹配结果数组的正确方法。我的方法如下（简化示例）：

$(function() {
    var tags = [
        "One",
        "Two",
        "Three"
    ];
    $("input").autocomplete({
        source: tags,
        open: function() {
            // var topResult = HOW TO ACCESS?
            $('#divForText').text(topResult);
        }
    });
});

有人可以澄清如何访问匹配结果数组中的第一个值吗？

Answer 1

这是你可以实现这一目标的一种方式：

$("input").autocomplete({
    source: function(request, response) {
        var filtered = $.ui.autocomplete.filter(tags, request.term)
            , first = filtered.length ? filtered[0] : null;

        if (first) {
            $("#divForText").text(first);
        } else {
            $("#divForText").empty();
        }

        response($.ui.autocomplete.filter(langs, request.term));
    }
});

基本上，这是使用将函数作为参数的source版本。该函数只使用filter method that autocomplete uses internally，然后更新内容。

以下是一个有效的例子：http://jsfiddle.net/UGsHR/75/

将建议结果添加到jQuery UI自动完成输入？

1 个答案: