0

我想知道如何使用键盘向上/向下箭头选择建议 div 的选项，就像在 youtube 中一样，当您键入任何键并出现建议时，您可以使用键盘箭头选择一个选项。我有一个文本框，下面有一个“建议”div。我该怎么做？（我没有使用 jQuery 自动完成）

4

1 回答 1

1

你可以看看jQuery UI Autocomplete 插件。这是文档中的一个示例，它说明了如何<input>使用指定的数据源将标准元素转换为自动完成框：

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>jQuery UI Autocomplete - Default functionality</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css" />
    <script>
    $(function() {
        var availableTags = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "BASIC",
            "C",
            "C++",
            "Clojure",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "JavaScript",
            "Lisp",
            "Perl",
            "PHP",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
        ];
        $( "#tags" ).autocomplete({
            source: availableTags
        });
    });
    </script>
</head>
<body>

<div class="ui-widget">
    <label for="tags">Tags: </label>
    <input id="tags" />
</div>


</body>
</html>

在此示例中，数据被硬编码到 HTML 中，但插件也支持检索自动完成值using a remote datasource。

因此，如果您在实现中遇到一些特定问题（当然不要忘记展示您到目前为止的进度），您可以使用它并返回 StackOverflow。

于 2012-12-26T13:24:10.787 回答