Scriptaculous在Firefox中不起作用

Question

我正在处理一个项目，它使用实现了一个自动完成的textfield。在小于10的Internet版本中，系统工作正常，但是由于版本10和其他浏览器(如Firefox或Chrome )，自动完成功能存在缺陷。我已经用prototype 1.7将Scriptaculous更新为1.9，但是没有什么改变。

<label for="possibleClient">Verfügbare Klienten</label><br>
            <input type="text" id="possibleClient" class="fill intellisense"><div id="possibleClientUpdate" class="auto-complete"></div>

            <script type="text/javascript" language="javascript" charset="utf-8">
            // <![CDATA[

            function updateClientList(input,listitem) {

                var nodes = document.getElementsByClassName('informal', listitem) || [];
                if(nodes.length>0) label = Element.collectTextNodes(nodes[0], listitem);
                addToList("chosenClients",input.value,label);
                input.value="";
            }

            var ac = new Ajax.Autocompleter('possibleClient','possibleClientUpdate','/data/clients.php',{paramName: 'search',minChars:1, parameters:'projektIDs=<?php echo $projektID ?>&searchnName=true', select:'selectme', afterUpdateElement: updateClientList});
            // ]]>
            </script>               

我完全不知道。

更新

嗨，坦克所有的快速答案。有缺陷是什么意思。我正在更新一个较旧的系统，以便为任何浏览器做好准备。缺陷意味着自动完成不能工作。如果我输入了什么，在新的浏览器中会发生什么。当激活兼容模式时，它在ie 10中工作。

系统没有使用json文件。The返回一个

<ul><li></li></ul> 

文字段落。

例如：

<ul><li><span class='informal'>Aicher Jasmin</span> (<span class='selectme'>65</span>)</li><li><span class='informal'>Bader Jacqueline Bernice</span> (<span class='selectme'>77</span>)</li><li><span class='informal'>Freisslich Claudia</span> (<span class='selectme'>78</span>)</li><li><span class='informal'>Goller Sascha</span> (<span class='selectme'>64</span>)</li><li><span class='informal'>Hebein Ilse</span> (<span class='selectme'>75</span>)</li><li><span class='informal'>Hohenwarter Berndt</span> (<span class='selectme'>60</span>)</li><li><span class='informal'>Kanz Bernhard</span> (<span class='selectme'>69</span>)</li><li><span class='informal'>Kohlmaier Angelika</span> (<span class='selectme'>68</span>)</li><li><span class='informal'>Konic Isabella</span> (<span class='selectme'>71</span>)</li><li><span class='informal'>Kosche Karl-Heinz</span> (<span class='selectme'>63</span>)</li><li><span class='informal'>Kreilitsch Jutta</span> (<span class='selectme'>70</span>)</li><li><span class='informal'>Kribitsch Bernhard</span> (<span class='selectme'>61</span>)</li><li><span class='informal'>Lackner Ermelinde</span> (<span class='selectme'>79</span>)</li><li><span class='informal'>M&ouml;sslacher Wolfgang</span> (<span class='selectme'>67</span>)</li><li><span class='informal'>M&uuml;ller Hans</span> (<span class='selectme'>54</span>)</li></ul>

我也不认为数据源是问题所在，因为它适用于较旧的浏览器。

如果我在firefox中启动了开发人员控制台，并输入以下内容：

我看到调用了这个过程，并且脚本正在获取07:35:47.367 POST https://myserver.at/data/clients.php HTTP/1.1200OK 45ms中的数据

但是我没有看到有自动完成建议的下拉div。可能是css问题吗？下面是自动完成的css文件：

div.auto-complete {
  position:absolute;
  width:250px;
  background-color:white;
  border:1px solid #888;
  margin:1px 1px 0 1px;
  padding:0px;
}
div.auto-complete ul {
  list-style-type: none;
  margin:0px;
  padding:0px;
}
div.auto-complete ul li.selected { background-color: #ffb;}
div.auto-complete ul li {
  list-style-type: none;
  display:block;
  margin:0;
  padding:2px;
  height:22px;
  cursor:pointer;
}

Answer 1

想到为什么它能在旧的浏览器中工作，但不是更新的原因是，您的JSON无效：

var b = eval("[{nooo:'json0'},{nooo:'json1'}]"); //works
var b = JSON.parse("[{nooo:'json0'},{nooo:'json1'}]")// doesn't
              // because the string isn't valid json
var b = JSON.parse('[{"nooo":"json0"},{"nooo":"json1"}]');//works, valid JSON string

要解决这个问题，您应该让PHP返回有效的JSON。

在安装了Firebug的FireFox中，您可以右键单击文本框，然后选择“使用firebug检查元素”，如果将firebug窗口停靠，您应该会看到元素，元素下面是“下拉”结果。

当您键入某些内容并完成xhr请求时，结果应该有一个UL元素--当我在http://www.ajaxdaddy.com/scriptaculous-autocomplete.html上使用它时，请参阅下面的图像

我上面提到的URL是否有效(它适用于Firefox，但使用1.7)？

​

​

以下是结果：

​

​

Answer 2

嗨，坦克所有的快速答案。有缺陷是什么意思。我正在更新一个较旧的系统，以便为任何浏览器做好准备。缺陷意味着自动完成不能工作。如果我输入了什么，在新的浏览器中会发生什么。当激活兼容模式时，它在ie 10中工作。

系统没有使用json文件。The返回一个

<ul><li></li></ul> 

文字段落。

例如：

<ul><li><span class='informal'>Aicher Jasmin</span> (<span class='selectme'>65</span>)</li><li><span class='informal'>Bader Jacqueline Bernice</span> (<span class='selectme'>77</span>)</li><li><span class='informal'>Freisslich Claudia</span> (<span class='selectme'>78</span>)</li><li><span class='informal'>Goller Sascha</span> (<span class='selectme'>64</span>)</li><li><span class='informal'>Hebein Ilse</span> (<span class='selectme'>75</span>)</li><li><span class='informal'>Hohenwarter Berndt</span> (<span class='selectme'>60</span>)</li><li><span class='informal'>Kanz Bernhard</span> (<span class='selectme'>69</span>)</li><li><span class='informal'>Kohlmaier Angelika</span> (<span class='selectme'>68</span>)</li><li><span class='informal'>Konic Isabella</span> (<span class='selectme'>71</span>)</li><li><span class='informal'>Kosche Karl-Heinz</span> (<span class='selectme'>63</span>)</li><li><span class='informal'>Kreilitsch Jutta</span> (<span class='selectme'>70</span>)</li><li><span class='informal'>Kribitsch Bernhard</span> (<span class='selectme'>61</span>)</li><li><span class='informal'>Lackner Ermelinde</span> (<span class='selectme'>79</span>)</li><li><span class='informal'>M&ouml;sslacher Wolfgang</span> (<span class='selectme'>67</span>)</li><li><span class='informal'>M&uuml;ller Hans</span> (<span class='selectme'>54</span>)</li></ul>

我也不认为数据源是问题所在，因为它适用于较旧的浏览器。

如果我在firefox中启动了开发人员控制台，并输入以下内容：

我看到调用了这个过程，并且脚本正在获取07:35:47.367 POST https://myserver.at/data/clients.php HTTP/1.1200OK 45ms中的数据

但是我没有看到有自动完成建议的下拉div。可能是css问题吗？下面是自动完成的css文件：

div.auto-complete {
  position:absolute;
  width:250px;
  background-color:white;
  border:1px solid #888;
  margin:1px 1px 0 1px;
  padding:0px;
}
div.auto-complete ul {
  list-style-type: none;
  margin:0px;
  padding:0px;
}
div.auto-complete ul li.selected { background-color: #ffb;}
div.auto-complete ul li {
  list-style-type: none;
  display:block;
  margin:0;
  padding:2px;
  height:22px;
  cursor:pointer;
}

Answer 3

是的，一切都像你说的那样工作，还有样例链接。但是当我调试这个元素时，div道具就会显示:无，而且它们不会改变。他添加了元素，但没有显示出来。

    <div id="possibleClientUpdate" style="display: none;">
<ul>...
</div>

我如何解决这个问题？