Javascript：未捕获的类型错误自动完成不是功能

Question

我知道这个问题已经发布了很多，因为我一直在尝试寻找解决方案的每一个答案，但它对我的代码不起作用。

我尝试在搜索栏上使用 jquery-ui 调用自动完成功能，但每次加载页面时都会收到类型错误，提示自动完成不是一个功能。

我已经删除了加载 javascript ui 的每个实例，并将其放在我的 javascript 文件夹中名为“jquery-ui-src.php”的单独文件中，如下所示

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

然后在需要使用 jquery-ui 的文件中调用它。我认为捕获错误的文件在我的“header.php”文件中，该文件充当整个站点的标题

<?php
    session_start();
    include("assets/js/jquery-ui-src.php");
 ?> 
<header id="header" class="website-header">

//other code included here

//code for the search bar

<form role="search" action="<?php echo SITE_URL; ?>search" method="GET" style="width: 12em; margin: 0.1em 2em;margin-left:7em">
    <div class="input-group">
        <input type="text" id="tags" class="search-field form-control">
        <div class="input-group-btn">
            <button type="submit" class="btn btn-default">Search</button>
        </div>
    </div>
</form>
</div>

//other code included here




<script>
$(document).ready(function(){
    $("#account-dropdown").click(function(){
        $("#account-box").slideToggle(400);
        $(this).css("color", "white");
        return false;
    });                         
    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
    ];

    $("#tags").autocomplete({
        source: availableTags
    });

});
</script>
</header>

每当页面加载时，我都会收到错误消息，说自动完成不是一个功能，我真的不知道为什么会这样。

感谢任何帮助，谢谢。

编辑

我已经删除了调用 jquery 脚本的头文件中的第二个实例，但我仍然收到错误消息。

这里可能会用到其他信息，但我不是制作初始文件的人，我被分配了一些任务来改进它，其中之一是使用搜索栏，因此它可能对知道这个项目中有多个（实际上很多）文件。其中很多也调用不同的脚本，我应该将所有这些脚本移动到我的“jquery-ui-src.php”文件中吗？这有可能修复错误吗？

Answer 1

因为您正在中间导入另一个 jQuery，因此您使用 jquery-ui-src.php 导入的所有内容都已重置。

请尝试删除此行：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

还有无效的结束标签：</div>//other code included here. 删除它。

下面是工作代码。这是fiddle。

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<header id="header" class="website-header">
    <form role="search" action="" method="GET" style="width: 12em; margin: 0.1em 2em;margin-left:7em">
        <div class="input-group">
            <input type="text" id="tags" class="search-field form-control" />
            <div class="input-group-btn">
                <button type="submit" class="btn btn-default">Search</button>
            </div>
        </div>
    </form>
    <script>
        $(document).ready(function() {
            $("#account-dropdown").click(function() {
                $("#account-box").slideToggle(400);
                $(this).css("color", "white");
                return false;
            });
            var availableTags = [
                "ActionScript",
                "AppleScript",
                "Asp",
                "BASIC",
                "C",
                "C++",
                "Clojure",
                "COBOL",
                "ColdFusion",
                "Erlang",
                "Fortran",
                "Groovy",
                "Haskell",
                "Java",
                "JavaScript",
                "Lisp",
                "Perl",
                "PHP",
                "Python",
                "Ruby",
                "Scala",
                "Scheme"];

            $("#tags").autocomplete({
                source: availableTags
            });

        });
    </script>
</header>