javascript - 使 jquery 自动完成也由箭头控制

Question

我正在创建一个网站以开始学习编码，并正在制作一个具有搜索自动完成功能的搜索网站。脚本在这里。

这很好用（对于 jquery 和编码初学者来说，它确实是一个很棒且简单的脚本！）但是当建议弹出时，我希望能够通过像谷歌一样在我的键盘上向上/向下移动来控制它们。我怎样才能做到这一点（我只知道关于 jquery 的最基本知识:)

超级感谢所有帮助！

Answer 1

也许考虑使用jQuerys自己的jQuery-UI库的自动完成：http: //jqueryui.com/demos/autocomplete/

默认情况下，它具有键盘控件。

如果您像这样修改它，您可以使用您发布的解决方案中的 PHP 脚本：

$db = new mysqli('DB_HOST', 'USERNAME', 'PASSWORD', 'DATABASE_NAME');
//create array to store results
$results = array();

if ($db) {
  if (isset($_POST['queryString'])) {
    $queryString = $db->real_escape_string($_POST['queryString']);
    if (strlen($queryString) > 0) {
      $query = $db->query("SELECT country FROM countries WHERE country LIKE '$queryString%' LIMIT 10");
      if ($query) {
        while ($result = $query->fetch_object()) {
          //add results to array
          $results[] = $result->country;
        }
      }
    }
  }
}
//echo result array as JSON
echo json_encode($results);

有关详细信息，请参阅http://jqueryui.com/demos/autocomplete/#remote