jquery autocomplete显示div内的返回html结果

时间:2014-09-30 15:02:08

标签: javascript php jquery ajax autocomplete

我在这里尝试自动填充搜索框。当我在文本框中键入文本时,它会正确过滤结果。我已经检查了我的控制台。我在HTML标签窗口中看到了结果。但是,我无法在文本框下获得结果。您可以在输入字段后看到div。我想在这个div中显示结果。

我试过这行$('#result').html(data);,但我没有在div中得到结果。如何在div中显示html结果?

的index.php

<script type="text/javascript">
$(function() {
$( "#searchid" ).autocomplete(
    {
            source: "<?=asort_get_url(SEARCH_BOX)?>",
            minLength: 1,
            select: function (event,ui) {
            //alert(ui.item.url);
            $('#result').empty();
            window.location = ui.item.url;          
    }
    }).data( "ui-autocomplete" )._renderItem = function( ul, item ){
         $('#result').html(data);
    };
});
</script>

<input type="text" class="search" id="searchid" />
<div id="result"></div>

search_box.php

$url = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
    $query = parse_url($url, PHP_URL_QUERY);
    parse_str($query);
    parse_str($query, $arr);
$q = mysql_real_escape_string(trim($term, '/'));
        $sql = "SELECT model_name, maker_url, model_url FROM ".TBL_CAR_ADD_MODELS." WHERE model_status = '1' AND model_url != '".$model_url."' AND model_name LIKE '%$q%' LIMIT 7";
        $res = mysql_query($sql, $CN);
        while($row = mysql_fetch_array($res))
        {
           echo "<a onMouseOver=\"this.style.backgroundColor='#09F'\" onMouseOut=\"this.style.backgroundColor='#F2F2F2'\" href=".asort_get_url(CAR_MAKE, $row['maker_url'], $row['model_url'])." style='width: 380px; height: 95px; text-decoration: none; display: inline-block; margin: 0 auto; color: #000; margin-left: -20px; background :#F2F2F2; border-bottom: 1px solid #CCC;'><img style='margin:5px;' alt='".$row['model_name']."' src=".fa_model_image_path("thumb", $row['maker_url'],$row['model_url'])." />"."<span style=' margin-left: 20px; margin-top: 0px; position: absolute; display: inline-block;'>".$row['model_name']."</span>"."</a>";
        }

1 个答案:

答案 0 :(得分:1)

你必须编写类似这样的代码

.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
  $('#result' ).html(item.value)
             };