我正在遵循一个在线教程(http://mycodde.blogspot.co.uk/2013/12/typeaheadjs-autocomplete-tutorial-ajax.html#comment-form),它喜欢typeahead.js和一个简单的MySQL DB,但我无法让它工作。
使用typeahead.js v10.2 jQuery v1.9.1和Bootstrap v3.2.0
我已经包含了必要的css和js文件,我还创建了一个connection.php文件,它成功地连接到了我的localhost db。
问题是自动提示框没有自动提示任何东西。我可能在做一些愚蠢的事情,因为我对js和编程并不熟悉。
我已经把我的档案列在下面,如果有人能给我指出正确的方向,我会很感激的。
index.php
<!DOCTYPE>
<html lang="en">
<head>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<title>Typeahead.js Tutorial with Mysql Database</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="generator" content="Geany 1.23.1" />
</head>
<body>
<input type="text" name="search" id="search"></div>
</body>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/js/bootstrap.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.10.2/bloodhound.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.10.2/typeahead.bundle.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.10.2/typeahead.jquery.js"></script>
<script>
$("document").ready(function(){
$("#search").typeahead({
name : 'sear',
remote: {
url : '/connection.php?query=%QUERY'
}
});
});
</script>
</html>connection.php
<?php
$con=mysqli_connect("localhost","myuser","mypassword","mydb");
// Check connection
if (mysqli_connect_errno()) {
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$result = mysqli_query($con,"SELECT first_name,last_name FROM actor");
while($row = $result->fetch_object()){
$user_arr[] = $row->first_name;
$user_arr2[] = $row->last_name;
}
mysqli_close($con);
?>当我检查firebug控制台时,我得到了一个未定义的TypeError:未定义的is函数出现在第22行,即;
$("#search").typeahead({有人能帮忙吗?
谢谢
发布于 2014-07-08 13:26:48
在这里检查jquery就绪绑定处理程序语法:
$("document").ready(...一定是
$( document ).ready(...阅读更多:http://learn.jquery.com/using-jquery-core/document-ready/
发布于 2015-03-21 04:28:18
您需要在.js文件中添加以下代码:
var search = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('sear'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
limit: 10,
remote: {
url: '/connection.php?query=%QUERY',
filter: function(list) {
return $.map(list, function(search) {
return {
name: sear
};
});
}
}
});json文件包含一个字符串数组,但是Bloodhound建议引擎需要JavaScript对象,因此这将转换所有这些字符串。
https://stackoverflow.com/questions/24632406
复制相似问题