jQuery自动完成列表Css

因此，我没有使用jQueryUIAutoComplete，因为我有一个简单的应用程序。 然而，在我对输入框的最后润色中，我陷入了一个简单的CSS问题

我希望列表项（由jQuery.post创建）在悬停时高亮显示

HTML:

以下是chrome在AJAX请求后报告的内容：

所以

只是在碍事

---

移除并使用填充进行调整

检查标记输出是否正确。你的CSS工作正常。我使用了静态css，但当jQuery加载元素时，它似乎不起作用。为什么？setTimeout总是值得一试…setTimeout到底有什么帮助？抱歉，我不太熟悉它的用法。setTimeout在执行其内部函数之前会等待一定的时间。当调用javascript之前DOM未完全加载时，它非常有用。我通常在我不知道发生了什么的时候试一下，哈哈<代码>函数（输出）{setTimeout（函数（）{$（'#links'）.html（输出）.show（）；}，200）；}很抱歉重复了一篇旧文章，刚才遇到了这个问题，希望提供某种类型的答案。

<div id="wrapper">
    <div id="input"><input id="name" type="text" /></div>
    <div id="links"></div>
    <div id="space"></div>
</div>

<script type="text/javascript">
    $('#name').keyup(function(){
        var name = $('#name').val();
        $.post(
            'process.php',
            {name:name},
            function(output){
                $('#links').html(output).show();
        });
    });
</script>

require('config.php');
if(isset($_POST['name'])){
    $name = mysql_real_escape_string(strtolower($_POST['name']));
    if($name==NULL)
        echo "Please Enter a Name";
        else{
        $qName = '%'.$name.'%';
        $query = "SELECT name FROM table WHERE name LIKE '$qName'";
        $result = mysql_query($query);
        $rowCount = mysql_num_rows($result);
        if($rowCount==0)
            echo "No Matches Found!";
        else{
            $name = ucfirst($name);
            echo '<ul>';
            while ($row = mysql_fetch_assoc($result)) {
                echo '<li><a href="#">' . $row["name"] . '</a></li>';
            }
            echo '</ul>';
        }
    }
}

#links ul {
    list-style-type:none;
    width:150px;
} 
#links li a { 
    color:#000;
    background-color:#EEE;
    display:block;
    text-decoration:none;
}
* html #links li a {  /* make hover effect work in IE */
    width: 150px;
}
#links li a:hover {
    background:#CCC;
}