Bootstrap4：自动完成预先输入搜索，使用ajax调用故障排除

Answer 1

您的 Ajax 调用一定有问题，因为

typeahead

似乎在搜索框中输入的每个字符都会更新，请参阅演示：

//
$('#phone-autocomplete').typeahead({
  source: function(query, process) {
    data = ["9876124", "9812124", "9875124", ];
    console.log(`Ajax call with query: ${query}`);
    return process(data);
  },
  'updater': function(item) {
    this.$element[0].value = item;
    console.log(item);
    this.$element[0].form.submit();
    return item;
  }
});

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

<form class="form-inline ml-3" action="/phone-autocomplete/">
  <div class="input-group input-group-sm">
    <input class="form-control form-control-navbar typeahead" data-provide="typeahead" autocomplete="off" id="phone-autocomplete" type="search" name="searchstring" placeholder="search phone" aria-label="Search">
    <div class="input-group-append">
      <button class="btn btn-navbar" type="submit">
                <i class="fas fa-search"></i>
            </button>
    </div>
  </div>
</form>