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

Question

我正在创建一个网站来开始学习编码，并正在创建一个具有搜索自动完成功能的搜索网站。脚本是here .

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

super 感谢您的帮助!

Answer 1

也许可以考虑使用 jQuery 自己的 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了解更多详情