使用ajax自动完成

Question

也许您可以解决一些Ajax问题。

我有AUTO COMPLETE代码-我输入城市名称，该代码会自动为我完成城市名称，还获取城市ID，并应将其放入隐藏的输入字段中（名称=“
cityID”）…但它没有做到这一点。

你能告诉我为什么吗？

html代码：

<p><label>city: </label><input type='text' name='cityName' value='$cityName'  id='keyword_city' autocomplete='off' />
    <span id='ajax_response_city' class='ajax_response' style='display:none;' ></span>
    <input type='hidden' name='cityID' value='$cityID' id='keyword_cityID'>
</p>

服务器端（仅输出）：

echo '<li><a href=\'javascript:void(0);\' data-id="'.$row['cityID'].'">'.$final.'</a></li>';

脚本：

$("#ajax_response_city").mouseover(function(){
    $(this).find("li a").mouseover(function () {
          $(this).addClass("selected");
    });
    $(this).find("li a").mouseout(function () {
          $(this).removeClass("selected");
    });
    $(this).find("li a").click(function () {
          $("#keyword_city").val($(this).text());
          $("#keyword_cityID").val($(this).data().id);
          $("#ajax_response_city").fadeOut("slow");
    });
});

您可以在这里找到完整的JS：

http://www.dogger.co.il/js/ajax/autoComplate_city.js

Answer 1

尝试对ajax_response_city使用div而不是span标签。HTML被弄乱了，您的选择将不再起作用。

我举了一个例子：http :
//jsfiddle.net/me2loveit2/86T4f/

<div id='ajax_response_city' class='ajax_response'></div>

我也将开始使用适当的html（例如将li元素放入ul或ol）以避免此类问题。