在我的项目中,typeahead.js给出错误：
Uncaught TypeError: $(…).typeahead is not a function
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="public/js/typeahead.js"></script>
<script>
jQuery(document).ready(function() {
var offset = 250;
var duration = 300;
jQuery(window).scroll(function() {
if (jQuery(this).scrollTop() > offset) {
jQuery('.back-to-top').fadeIn(duration);
} else {
jQuery('.back-to-top').fadeOut(duration);
}
});
jQuery('.back-to-top').click(function(event) {
event.preventDefault();
jQuery('html,body').animate({scrollTop: 0},duration);
return false;
});
$('input.search').typeahead({
name: 'companyName',remote:'ser_sug.PHP?key=%QUERY',limit : 10
});
});
</script>
<style type="text/css">
.bs-example{
font-family: sans-serif;
position: relative;
margin: 50px;
}
.typeahead,.tt-query,.tt-hint {
border: 2px solid #CCCCCC;
border-radius: 8px;
font-size: 24px;
height: 30px;
line-height: 30px;
outline: medium none;
padding: 8px 12px;
width: 396px;
}
.typeahead {
background-color: #FFFFFF;
}
.typeahead:focus {
border: 2px solid #0097CF;
}
.tt-query {
Box-shadow: 0 1px 1px rgba(0,0.075) inset;
}
.tt-hint {
color: #999999;
}
.tt-dropdown-menu {
background-color: #FFFFFF;
border: 1px solid rgba(0,0.2);
border-radius: 8px;
Box-shadow: 0 5px 10px rgba(0,0.2);
margin-top: 12px;
padding: 8px 0;
width: 422px;
}
.tt-suggestion {
font-size: 24px;
line-height: 24px;
padding: 3px 20px;
}
.tt-suggestion.tt-is-under-cursor {
background-color: #0097CF;
color: #FFFFFF;
}
.tt-suggestion p {
margin: 0;
}
</style>
</head>
<div class="col-lg-3 cd-row">
<div class="heading" style="padding:0;margin:0;border:none;">
<h3 class="advSearchHeading" style="color:#fff;">Search Ceramic</h3>
</div>
<form role="form" class="advSearchForm" action="<?PHP echo SLASHES;?>search/" method="get" style="overflow:hidden;">
<div class="form-group">
<input name="companyName" type="text" value="" placeholder="Company name" class="search" id="searchid">
</div>
<div class="form-group">
<select name="category" class="form-control">
<option selected value="">Select Category</option>
<?PHP
$categoryResult = MysqL_query("SELECT * FROM `category` where flag = 1 order by `sequence`");
while($categoryRow = MysqL_fetch_assoc($categoryResult))
echo '<option value="'.$categoryRow['cid'].'">'.$categoryRow['cat_name'].'</option>';
?>
</select>
</div>
<div class="form-group">
<select name="productSize" id="productSize" class="form-control">
<option selected value="">Select Size(CentiMeter)</option>
<?PHP
$sizeResult = MysqL_query("SELECT * FROM sizes ORDER BY sequence");
while($sizeRow = MysqL_fetch_assoc($sizeResult))
echo '<option value="'.$sizeRow['id'].'">'.$sizeRow['inch'].'</option>';
?>
</select>
</div>
<div class="form-group">
<input name="location" type="text" value="" placeholder="Addr / city / state / country / pin" class="form-control">
</div>
<button type="submit" class="btn btn-default pull-right" style="font-weight: bold; font-size: 12px;">Search</button>
</form>
</div>
</div>
sur_sug.PHP
<?PHP MysqL_connect('localhost','username','pass'); MysqL_select_db("database"); $key=$_GET['key']; $array = array(); $query=MysqL_query("select com_name from company_details where com_name LIKE '%{$key}%'"); while($row=MysqL_fetch_assoc($query)) { $array[] = $row['com_name']; } echo json_encode($array); ?>
我试图把我的$(文档).ready在一个不同的地方,但它给出以下错误：
请帮帮我.
解决方法
它与数据量无关,但是没有找到public / js / typeahead.js
将其更改为/js/typeahead.js,它将正常工作
<html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="/js/typeahead.js"></script> <script> // ...
