javascript – 具有大数据库的Typeahead.js给出了未捕获的TypeError:$(…).typeahead不是函数

前端之家收集整理的这篇文章主要介绍了javascript – 具有大数据库的Typeahead.js给出了未捕获的TypeError:$(…).typeahead不是函数前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
在我的项目中,typeahead.js给出错误

Uncaught TypeError: $(…).typeahead is not a function

PHP

  1. <html>
  2. <head>
  3. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  4. <script src="public/js/typeahead.js"></script>
  5. <script>
  6. jQuery(document).ready(function() {
  7. var offset = 250;
  8. var duration = 300;
  9. jQuery(window).scroll(function() {
  10. if (jQuery(this).scrollTop() > offset) {
  11. jQuery('.back-to-top').fadeIn(duration);
  12. } else {
  13. jQuery('.back-to-top').fadeOut(duration);
  14. }
  15. });
  16.  
  17. jQuery('.back-to-top').click(function(event) {
  18. event.preventDefault();
  19. jQuery('html,body').animate({scrollTop: 0},duration);
  20. return false;
  21. });
  22. $('input.search').typeahead({
  23. name: 'companyName',remote:'ser_sug.PHP?key=%QUERY',limit : 10
  24. });
  25. });
  26. </script>
  27. <style type="text/css">
  28. .bs-example{
  29. font-family: sans-serif;
  30. position: relative;
  31. margin: 50px;
  32. }
  33. .typeahead,.tt-query,.tt-hint {
  34. border: 2px solid #CCCCCC;
  35. border-radius: 8px;
  36. font-size: 24px;
  37. height: 30px;
  38. line-height: 30px;
  39. outline: medium none;
  40. padding: 8px 12px;
  41. width: 396px;
  42. }
  43. .typeahead {
  44. background-color: #FFFFFF;
  45. }
  46. .typeahead:focus {
  47. border: 2px solid #0097CF;
  48. }
  49. .tt-query {
  50. Box-shadow: 0 1px 1px rgba(0,0.075) inset;
  51. }
  52. .tt-hint {
  53. color: #999999;
  54. }
  55. .tt-dropdown-menu {
  56. background-color: #FFFFFF;
  57. border: 1px solid rgba(0,0.2);
  58. border-radius: 8px;
  59. Box-shadow: 0 5px 10px rgba(0,0.2);
  60. margin-top: 12px;
  61. padding: 8px 0;
  62. width: 422px;
  63. }
  64. .tt-suggestion {
  65. font-size: 24px;
  66. line-height: 24px;
  67. padding: 3px 20px;
  68. }
  69. .tt-suggestion.tt-is-under-cursor {
  70. background-color: #0097CF;
  71. color: #FFFFFF;
  72. }
  73. .tt-suggestion p {
  74. margin: 0;
  75. }
  76. </style>
  77. </head>
  78. <div class="col-lg-3 cd-row">
  79. <div class="heading" style="padding:0;margin:0;border:none;">
  80. <h3 class="advSearchHeading" style="color:#fff;">Search Ceramic</h3>
  81. </div>
  82. <form role="form" class="advSearchForm" action="<?PHP echo SLASHES;?>search/" method="get" style="overflow:hidden;">
  83. <div class="form-group">
  84. <input name="companyName" type="text" value="" placeholder="Company name" class="search" id="searchid">
  85. </div>
  86. <div class="form-group">
  87. <select name="category" class="form-control">
  88. <option selected value="">Select Category</option>
  89. <?PHP
  90. $categoryResult = MysqL_query("SELECT * FROM `category` where flag = 1 order by `sequence`");
  91. while($categoryRow = MysqL_fetch_assoc($categoryResult))
  92. echo '<option value="'.$categoryRow['cid'].'">'.$categoryRow['cat_name'].'</option>';
  93. ?>
  94. </select>
  95. </div>
  96. <div class="form-group">
  97. <select name="productSize" id="productSize" class="form-control">
  98. <option selected value="">Select Size(CentiMeter)</option>
  99. <?PHP
  100. $sizeResult = MysqL_query("SELECT * FROM sizes ORDER BY sequence");
  101. while($sizeRow = MysqL_fetch_assoc($sizeResult))
  102. echo '<option value="'.$sizeRow['id'].'">'.$sizeRow['inch'].'</option>';
  103. ?>
  104. </select>
  105. </div>
  106. <div class="form-group">
  107. <input name="location" type="text" value="" placeholder="Addr / city / state / country / pin" class="form-control">
  108. </div>
  109. <button type="submit" class="btn btn-default pull-right" style="font-weight: bold; font-size: 12px;">Search</button>
  110. </form>
  111. </div>
  112. </div>

sur_sug.PHP

  1. <?PHP
  2. MysqL_connect('localhost','username','pass');
  3. MysqL_select_db("database");
  4. $key=$_GET['key'];
  5. $array = array();
  6. $query=MysqL_query("select com_name from company_details where com_name LIKE '%{$key}%'");
  7. while($row=MysqL_fetch_assoc($query))
  8. {
  9. $array[] = $row['com_name'];
  10. }
  11. echo json_encode($array);
  12. ?>

我试图把我的$(文档).ready在一个不同的地方,但它给出以下错误

请帮帮我.

解决方法

它与数据量无关,但是没有找到public / js / typeahead.js

将其更改为/js/typeahead.js,它将正常工作

  1. <html>
  2. <head>
  3. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  4. <script src="/js/typeahead.js"></script>
  5. <script>
  6. // ...

猜你在找的JavaScript相关文章