2

I got a problem and I hope you guys can help me solve it.

I have this function in which I want to use autocomplete. With the help below, I managed to remove the error but now it just doesn't work when using Ajax. Like I wrote before, the bottom script (inbox.php) is loaded inside the top script (home.php).

I found out that the autocomplete script works if I open the page seperately (so just going to localhost/inbox.php), but when going through Ajax, it loses this. That's why I think now, that the problem is in the Ajax script, which can be found at the last part of the examples.

home.php (main page)

<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>

inbox.php (this page is loaded inside home.php, using 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>

And this is the Ajax part. This script is being called when clicking on a button in home.php (link not included, but is called through 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();

}

I hope you guys can see what I am doing wrong here! Thank you :)


var items = [];
$.each(JSONObject.results.bindings, function(i, obj) {
    items.push([obj.place.value, obj.lat.value, obj.long.value, obj.page.value]);
});
4

2 回答 2

1

正如评论所指出的,不要包含多个 jQuery 库。选择您想要/需要的一个版本并使用它。您包含 jQuery-ui 版本 1.10.0,它实际上是最新的并且仅与 jQuery 核心 1.6+ 兼容,因此请取出您的 1.3.0 包含。

您正在从内联事件调用autocomplete()home.php 中定义的自定义方法。onkeydown这是不必要的,就像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
        });
    });

你完成了。最后,正如其他人也提到的,不要发布代码的屏幕截图。复制/粘贴您的代码,将其缩进以使其格式化为代码,并指出错误发生在哪一行。此外,您应该在包含 profile.php 的地方包含一些代码。您对其工作原理的描述不充分。

底部图片 (​​profiel.php) 在顶部图片 (​​home.php) 的脚本中加载。

这可能是一个 iFrame、一个 php include 或 require、任意数量的 javascript/ajax 加载等,所有这些都会对代码的工作方式产生不同的影响。

于 2013-01-26T19:17:07.920 回答
1

是的,我有解决该问题的方法之一。

在我的程序中,问题是template.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#() has no method...),问题的关键是这个...

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

所以我禁用了那个链接,Alhamdulilah 它工作了。我希望,可能有用

于 2013-03-17T13:48:59.677 回答