Bootstrap 3 and Typeahead.js issue

本文关键字：js issue Typeahead and Bootstrap | 更新日期: 2023-09-27

我在github中使用bootstrap 3和typeahead.js时遇到问题https://github.com/twitter/typeahead.js/blob/master/doc/jquery_typeahead.md#datasets

当用户在我的输入字段中输入时，我试图从ajax中获取我的数据，以显示对用户的建议。

我的控制台不断给我一条消息，上面写着"未捕获的类型错误：无法读取未定义的属性‘替换’"

有什么帮助吗？

 <html>
 <head>
 <!-- Bootstrap framework -->
  <link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css" />
</head>
<body>
 <div class="well">
  <input type="text" class="span3 typeahead form-control" id="players" data-provide="typeahead">
 </div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
 <!-- main bootstrap js -->
  <script src="../bootstrap/js/bootstrap.min.js"></script>
 <!-- bootstrap plugins -->
 <script src="../js/bootstrap.plugins.min.js"></script>
 <!-- typeahead-->
 <script src="../lib/typeahead/typeahead.min.js"></script>
<script type="text/javascript">
  $(function(){
$('#players').typeahead({

  name: 'players',
  remote: function(query, cb){
       $.ajax({
      url: 'ajax/search.php',
      type: 'POST',
      data: 'query='+query,
      dataType: 'JSON',
      async: true,
      success: function(data){
        cb(data);
         }
        })
  }
})
 });
  </script>

Ajax数据文件（PHP）:

 <?
if(isset($_POST['query'])){
  include 'connect.php';
  $query = $_POST['query'];
  $sql = mysql_query("SELECT * FROM players WHERE name LIKE '%{$query}%'");
  $array = array();
  while($row = mysql_fetch_assoc($sql)){
   $array[] = $row['name'];
  }
  echo json_encode($array);
 }

 ?>

不能100%确定这是问题所在，但也许可以尝试更改

data: 'query='+query,

至

data: {"query" : query},

我遇到了这个问题，它解决了我的问题