jQuery mouseover 不适用于 li 元素

Question

我正在尝试创建一个基于 ul 元素的菜单，该元素将在链接下方显示链接描述。

到目前为止，我有以下代码(稍微简化)

      echo '
<script>
        $("#menu_1").mouseover(function() {
            $("#description").replaceWith("test");
        });
</script>

<ul class="menu_top">
<li id="menu_1"><a href = "#">Test</a></li>
</ul>

<div id="description" class="menu_desc">&nbsp;
</div>

';

但是，每次我将鼠标移到 li 元素上时，都没有任何反应。

有人知道我做错了什么吗？

Answer 1

您需要确保您的事件分配发生在文档加载完成之后，否则您的鼠标悬停事件也没有任何可附加的内容:

$(document).ready(function(){

$("#menu_1").mouseover(function() {
            $("#description").replaceWith("test");
        });

});

这是一个工作演示:http://jsfiddle.net/2mWb3/