Question

我正在尝试实施typeahead自动填充搜索功能，但没有运气。我大约两个星期的新jQuery，所以我不确定要去哪个方向。以下是我在页面加载时在Chrome调试器中收到的错误

Uncaught TypeError: Object [object Object] has no method 'typeahead' ... BankListMaster:17

这是指声明

之后的这段代码中的第一行

<script src="http://code.jquery.com/jquery-1.8.3.js" type="text/javascript"></script>
<script src="http://twitter.github.io/typeahead.js/releases/latest/typeahead.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#typeahead').typeahead({
            source: function (term, process) {
                var url = '@Url.Content("~/Home/GetNames")';

                return $.getJSON(url, { term: term }, function (data) {
                    return process(data);
                });
            }
        });
    });
</script>

typeahead功能正在搜索栏中使用，代码如下。仅供参考 - 被截断的<ul class="nav">标记只包含大量<li>个元素。只是缩短了它的可读性。

        <div class="navbar navbar-fixed-top">  
          <div class="navbar-inner">  
            <div class="container">  
            <ul class="nav"> ... </ul>  
        <ul class="nav"> 
        </ul>  
            <form class="navbar-search pull-left">  
              <input type="text" value="" id="typeahead" data-provide="typeahead" class="search-query" /> @*placeholder=" Agent search" />*@  
            </form>  
        <ul class="nav pull-right">  
          <li>@Html.MenuLink("Help", "About", "Home")</li>  
        </ul>  
            </div>  
          </div>  
        </div>
          <li>@Html.MenuLink("Help", "About", "Home")</li>  
        </ul>  
            </div>  
          </div>  
        </div>  
        <script src="@Url.Content("~/Scripts/jquery.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/bootstrap-dropdown.js")" type="text/javascript"></script>
        <script type="text/javascript">
            (function () {
                var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
                po.src = 'https://apis.google.com/js/plusone.js';
                var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
            })();  
        </script>

修改

我还尝试了以下两个声明，加上三个声明的任意数量组合（即http链接）并收到相同的错误

<script src="@Url.Content("~/Scripts/typeahead.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/typeahead.min.js")" type="text/javascript"></script>

第二次编辑

将jQuery版本和typeahead文件更改为以下内容，但仍然出现相同的错误...

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="@Url.Content("~/Scripts/bootstrap-typeahead.js")"></script>

Answer 1

我不知道这个问题的原因是什么，但这些声明解决了它。如果有人看到问题，我会暂时不回答这个问题。

<script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript" src="http://blattchat.com/demos/typeahead/js/bootstrap-typeahead.js"></script>

jQuery - 未捕获TypeError：对象[object Object]没有方法'typeahead'

1 个答案: