Question

我真的不知道为什么我的代码在Firefox中完美运行，但是当我在Chrome或IE中测试它时，它并没有填充动态下拉列表。我读了一些类似的帖子，但大多数人都说是因为我没有一个未公开的div！

以下是代码：

<html> 
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"/>
</head>

<body>    
<input type="textbox" name= "tag" id="tags">
<p>
<select id="movieImdbId" name="movieImdbId[]" multiple="multiple" width="200px" size="10px" style=display:none;>
</select>
</p>

<script type="text/javascript">
    $(document).ready(function () {
        $("#tags").autocomplete({
            source: "actorsauto.php",  //php file which fetch actors name from DB
            minLength: 2,
            select: function (event, ui){
                var selectedVal = $(this).val(); 
                // Here goes your ajax call.      
                $.post("actions.php", {q: selectedVal}, function (response){
                    // response variable above will contain the option tags.            
                    $("#movieImdbId").html(response).show();
                });
            }
        });     
    });        
</script>    
</body>
</html>

Answer 1

尝试明确地将您的回复映射到此处，这是我的代码更改适用的示例

从你的帖子请求中返回一个json对象，其中包含两个值，标签，你想要从自动完成中显示的内容和值，你要与该标签关联的值，在本例中我将值保存在property（.url）作为值，因为我希望自动完成同步到网址。

响应函数将结果绑定到控件。它接受$.map一个jquery委托，它将数组映射到所需的结构（标签映射到templab item.label（我在帖子中以json序列化的属性））（值映射到item.url）。

我不确定这是否会解决您的问题，但现在您将明确地绑定您的数据

success: function (data) {
    response($.map(data, function (item) {
    // this line below is a hack to get out the html encoded entities (&gt; &lt;...)
    var templab = $('#searchhtmlconverter').html(item.label).text();
    return { label: templab, value: item.url };
     }))

Answer 2

感谢this post，我终于可以通过使用autocompletechange event而不是更改事件来解决我的问题。

所以这是为我工作的代码：

$(document).ready(function () {
       $("#tags").autocomplete({
            source: "actorsauto.php",
            minLength: 2,
            select: function (event, ui){
$("#tags").on('autocompletechange change', function (){
var selectedVal = $(this).val();      //this will be your selected value from autocomplete

                    $.post("actions.php", {q: selectedVal}, function (response){

                    $("#movieName").html(response).show();

                });
              }).change();
    }
    });

}）;

Ajax调用动态填充下拉列表在FF中工作，但不在Chrome和IE中

2 个答案: