0

我有一个必须实现自动完成的要求，但我不确定是否可以在 jQuery UI 自动完成中实现这一点。如果我不能在 jQuery UI 自动完成中做到这一点，你能否建议可以做到这一点的库，或者我应该建立自己的库。

要求是我有一个列表，它只是普通的 javascript 有序数组，当用户键入一些内容时，文本框会建议可能的结果。当用户单击结果时，列表应更改为在单击结果上方显示 3 个结果，在单击结果下方显示 3 个结果。

这是我正在尝试做的代码。


    $(function() {
        var projects = [
            "List1","List2","List3","List4","List5","List6","List7","List8"
        ];

        $( "#project" ).autocomplete({
            minLength: 0,
            source: projects,
            focus: function( event, ui ) {
                $( "#project" ).val( ui.item.label );
                return false;
            },
            select: function( event, ui ) {
                $( "#project" ).val( ui.item.label );
                return false;
            }
        })
        .data( "autocomplete" )._renderItem = function( ul, item ) {
            return $( "
  • " )
                .data( "item.autocomplete", item )
                .append( "" + item.label + "" )
                .appendTo( ul );
        };
    });

    例如，如果用户键入“Li”，它应该会弹出“List1”、“List2”、“List3”、“List4”、“List5”。一旦用户单击“List3”，结果列表应更改为“List1”、“List2”、“List3”、“List4”、“List5”、“List6”并忽略“List7”、“List8”

    这在 jQuery UI 自动完成中是否可行？

    4

    1 回答 1

    0

    是的，听起来您需要简单地询问正在引用哪个选项，然后使用 .next() 或 .prev() jquery 函数。这些是相对的迭代工具（一个前向，一个后向），稍加技巧就可以满足您的需求。这是纯 jane jquery，因此您需要将其构建到您的侦听器中（在这种情况下为击键）

    下一个： http: //api.jquery.com/next/

    上一页：http ://api.jquery.com/prev/

    于 2012-05-20T00:00:46.827 回答