Question

我有鼠标悬停时激活这个小脚本的链接，当鼠标出来时问题没有隐藏

剧本：

<script>

function show_subcats(id)
{

   jQuery(".cat_sub_menu_"+id).show(1000);

   jQuery(".cat_sub_menu_"+id).mouseout(function() {

   jQuery(".cat_sub_menu_"+id).hide(1000);

});

}
</script>

链接激活功能：

<div>
    <a href="#" onmouseover="show_subcats('1');">Menu 1</a>

<div class="cat_sub_menu_1" style="display:none;">
Content Sub Menu
</div>
</div>

当我查看链接时显示div问题当我出去链接时，没有隐藏div

我不知道哪个是问题

最好的问候

Answer 1

Check this Demo

您需要在链接上使用mouseout并将其附加到<div>。那是你出错的地方。

function show_subcats(id) {

    jQuery(".cat_sub_menu_" + id).show(1000);
    jQuery('a').mouseout(function () {

        jQuery(".cat_sub_menu_" + id).hide(1000);

    });
}

上述解决方案虽然有效，但却不是定义事件处理程序的正确方法。

我建议这个简单的解决方案： Working Demo

如果您有多个<a>链接，请选择上述解决方案。

jQuery('a').mouseover(function () {
    show_subcats('1');
}).mouseout(function(){
    hide_subcats('1');
});

function show_subcats(id) {
    jQuery(".cat_sub_menu_" + id).show(1000);
}

function hide_subcats(id) {
    jQuery(".cat_sub_menu_" + id).hide(1000);
}


<a href="#" >Menu 1</a>

Answer 2

这可能会解决您的问题：

<script>

function show_subcats(id)
{

    jQuery(".cat_sub_menu_"+id).show(1000);

    jQuery(document).bind('mouseleave',".cat_sub_menu_"+id,function() {

    jQuery(".cat_sub_menu_"+id).hide(1000);

});
}
</script>

jquery mouseout没有用

2 个答案: