Typeahead.js 不显示建议

Question

我正在尝试为输入框提前输入。为此，我正在使用typeahead.js 。我正在使用相同的代码来学习此功能。虽然我没有收到任何错误，但它没有显示建议。我还包含了所有需要的脚本，如下所示：<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.min.js"></script>  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  <script src="the-basics.js"></script>Html 如下：<div class="container"><div id="the-basics">  <input class="typeahead" type="text" placeholder="States of USA"></div>  </div>js如下：var substringMatcher = function(strs) {console.log('strs', strs);return function findMatches(q, cb) {  console.log('q', q);  var matches, substringRegex;  // an array that will be populated with substring matches  matches = [];  console.log('matches', matches);  // regex used to determine if a string contains the substring `q`  substrRegex = new RegExp(q, 'i');  // iterate through the pool of strings and for any string that  // contains the substring `q`, add it to the `matches` array  $.each(strs, function(i, str) {    if (substrRegex.test(str)) {      matches.push(str);    }  });    console.log('matches', matches);  cb(matches);};};    var states = ['Alabama', 'Alaska', 'Arizona', 'California',    'Colorado', 'Connecticut', 'Delaware', 'Florida'  ];    $('#the-basics .typeahead').typeahead({    hint: true,    highlight: true,    minLength: 1  },  {    name: 'states',    source: substringMatcher(states)  });请帮我解决这个问题。

Answer 1

const states = [

  "Alabama",

  "Alaska",

  "Arizona",

  "California",

  "Colorado",

  "Connecticut",

  "Delaware",

  "Florida"

];

$("#the-basics .typeahead").typeahead({

  hint: true,

  highlight: true,

  minLength: 1,

  name: "states",

  source: states

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.min.js"></script>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />

<div class="container">

  <div id="the-basics">

    <input class="typeahead" type="text" placeholder="States of USA" autocomplete="off">

  </div>

</div>