未捕获的类型错误:对象 #<对象> 没有“自动完成”方法 - Uncaught TypeError: Object #<Object> has no method 'autocomplete'

我遇到了一个问题，希望你们能帮我解决。

我有这个功能，我想在其中使用自动完成。在下面的帮助下，我设法删除了错误，但现在它在使用 Ajax 时不起作用。就像我之前写的，底部脚本（收件箱.php）加载在顶部脚本（home.php）中。

我发现如果我单独打开页面，自动完成脚本就可以工作（所以只需转到本地主机/收件箱.php），但是在通过 Ajax 时，它会丢失这个。这就是为什么我现在认为问题出在 Ajax 脚本中，可以在示例的最后一部分找到。

首页.php （主页）

<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="homeV2.css" type="text/css" media="screen">
    <script type="text/javascript" src="javascript/index.js"></script>
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.6.4.js'></script>
    <script type='text/javascript' src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.0/jquery-ui.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.0/themes/black-tie/jquery-ui.css">
    <title> 
        Homepage Westpop Intranet 
    </title>
    <script>
        window.onload = function()
            {
                showHome(<?=$gid?>);
                refreshChat();
                countdown();                                
            }           
    </script>

</head>

收件箱.php（此页面加载在主页.php内，使用 Ajax）

<script type="text/javascript">
   var names = ['hi', 'bye', 'foo', 'bar'];
    $(document).ready(function() {
        $("#inputNaam").autocomplete({
          source: names
        });
    });
</script>
............ //some other script
    </div>
            </div>
        <div id='profielNieuwBericht'>
            <div id='nieuwBerichtKop'>
                Nieuw bericht
            </div>
            <table>
                <tr>
                    <td>Aan: </td>
                    <td><input type='text' class='inputNieuwBericht' id='inputNaam' /> </td>
                </tr>
                <tr>
                    <td> Onderwerp: </td>
                    <td> <input type='text' class='inputNieuwBericht' id='inputOnderwerp' /></td>
            </table>
            <textarea id='BerichtTextarea'></textarea></br>
            <input type='button' id='BerichtManagementButton' value='Stuur' />
        </div>
    </div>

这是阿贾克斯的部分。单击主页中的按钮时将调用此脚本.php（链接不包括在内，但通过 onClick='showInbox（id）' 调用）。

function showInbox(id){
if (id==''){
    document.getElementById("middenpag").innerHTML="";
    return;
}
if (window.XMLHttpRequest){
    xmlhttp=new XMLHttpRequest();
}
else{
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
    if(xmlhttp.readyState==4 && xmlhttp.status==200){
        document.getElementById("middenpag").innerHTML=xmlhttp.responseText;
    }
}
xmlhttp.open("GET","inbox.php?id="+id,true);
xmlhttp.send();

}

我希望你们能看到我在这里做错了什么！谢谢:)

正如注释所指出的，不要包含多个jQuery库。选择一个您想要/需要的版本并使用它。你包括jQuery-ui版本1.10.0，它实际上是最新的，并且只与jQuery核心1.6+兼容，所以去掉你的1.3.0包含。

您正在从 onkeydown 内联事件调用 home 中定义的自定义autocomplete()方法.php。这是不必要的，您声明的整个autocomplete()方法也是如此。从基本的自动完成示例开始，您需要执行的唯一代码如下：

配置文件.php HTML

<input type="text" class="inputNieuwBericht' id="inputNaam' />

在您的示例中，我看到您还错过了输入元素上的结束标签。此外，如果您将其作为表单的一部分提交，您将需要填写输入的 name='' 属性，否则处理表单提交的服务器脚本将无法从请求中获取变量。

JavaScript数组声明 - 如果你只在profile.php中使用它，那么把它放在那里。如果要在不同的包含文件之间重复使用相同的自动完成选项，请将其放在 home.php 中。或者将其放在一个单独的.php文件中，您可以从最终使用它的任何文件中include_once它。

<script type="text/javascript">
   var names = ['hi', 'bye', 'foo', 'bar'];
</script>

JavaScript 自动完成绑定 - 每次自动完成只需执行此操作一次，请使用 document.ready 处理程序，并且不要尝试将其与 onkeydown 内联事件一起使用。

<script type="text/javascript">
    $(document).ready(function() {
        $( "#tags" ).autocomplete({
          source: names
        });
    });

大功告成。最后，正如其他人也提到的，不要发布代码的屏幕截图。复制/粘贴代码，缩进它以使其格式化为代码，并指示错误发生在哪一行。此外，您应该包含包含配置文件.php的代码位。您对它如何工作的描述是不够的。

底部图片（profiel.php）加载在顶部图片（home.php）的脚本内。

这可能是一个iFrame，一个php包含或要求，任意数量的javascript/ajax加载等，所有这些都对代码需要如何工作有不同的影响。

我有一个解决这个问题的方法。

在我的程序中，问题是模板.tpl文件中重复的jQuery

**<script type="text/javascript" src="autocomplete/jquery.min.js"></script>**
<script type="text/javascript" src="autocomplete/jquery.tokeninput.js"></script>
<link rel="stylesheet" href="autocomplete/token-input.css" type="text/css" />
<link rel="stylesheet" href="autocomplete/token-input-facebook.css" type="text/css" />
<link rel="stylesheet" href="../../css/ui.all.css" rel="stylesheet" />
<link rel="stylesheet" href="../../css/styler.css"> 
**<script type="text/javascript" src="../../jsd/jquery-1.3.2.js"></script>**
<script type="text/javascript" src="../../jsd/ui.core.js"></script>
<script type="text/javascript" src="../../../js/ui.datepicker.js"></script>

我在我的模板中添加了新的 jquery.min.js 用于自动完成，

...
<script type="text/javascript" src="autocomplete/jquery.min.js"></script>
...

我发现了问题（.. bla bla object#（）没有方法... ），问题的关键是这个......

...
<!-- Trouble Autocomplete, so I disable this code -->
<-- <script type="text/javascript" src="../../jsd/jquery-1.3.2.js"></script> -->
...

所以我禁用了该链接，它可以工作。