javascript - Javascript 的鼠标进出事件

Question

初学者的问题..

我想在鼠标进入/离开父 div 时显示/隐藏内部 div。我首先尝试使用 onmouseover、onmouseout 事件，但问题是当鼠标悬停在 div 上时 onmouseover 继续触发，我希望它仅触发一次。

我找到了 JQuery可能对我有帮助的事件，但我不知道我可以把这段代码放在哪里，因为我的 div 存在于控件的模板中，并且 div 没有 onload 事件。

<script type="text/javascript" language="javascript">
    // Where should I call this !!!
    function Init(sender) {
        $(sender).bind("mouseenter", function () {
            $(sender.childNodes[1], this).show(500);
        }).bind("mouseleave", function () {
            $(sender.childNodes[1], this).hide(500);
        });
    }

</script>

任何帮助!

Answer 1

您可以使用 mouseenter和 mouseleave事件。

您可以将您的代码放入并与这些事件绑定(bind)。

<script type="text/javascript" language="javascript">

    $(document).ready(function(){
        Init('.your_div_class');
    });

    function Init(sender) {
        $(sender).bind("mouseenter", function () {
            $(sender.childNodes[1], this).show(500);
        }).bind("mouseleave", function () {
            $(sender.childNodes[1], this).hide(500);
        });
    }

</script>