在mousenter(悬停)上,显示和隐藏(切换)子元素

费戈索

有多个具有相同类的div。我想使用其类在悬停时隐藏/显示每个div。我更喜欢使用mouseenter / mouseleave。但是问题是,$target = this.id;这似乎不起作用。

如何使用课程显示/隐藏DIV?

$(".zz")
            .on( 'mouseenter', function() {
                $target = this.id;
                if( $target.is(':visible') ) return;
                    $target.hide();
            })
            .on( 'mouseleave', function() {
                    $target = this.id
                    if( !$target.is(':visible') ) return;
                        $target.show();
            });

编辑:jsFiddle

雕刻师

on()更好的方法是将所有事件组合为一个方法,而不是将多个方法链接在一起:

$(document).on({
    mouseenter: function() {
        $(this).find('div[id^="im"]').hide();
    },
    mouseleave: function() {
        $(this).find('div[id^="im"]').show();
    },
    click: function() {
        // do something else
    }
}, ".zz");

希望这可以帮助。

请看这个演示。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

javascript切换显示和隐藏几个div元素

来自分类Dev

HTML 切换显示和隐藏

来自分类Dev

jQuery切换允许父元素的默认href和父元素应显示子元素(切换)

来自分类Dev

从 React 中的父 onfocus 方法切换显示子组件上的隐藏类

来自分类Dev

如何在Reactjs中切换显示和隐藏元素?

来自分类Dev

隐藏和显示元素(切换)仅一段时间,然后淡出

来自分类Dev

Javascript:<td>上的隐藏和显示切换按钮在页面加载时恢复

来自分类Dev

切换 Jquery 上的变量,帮助隐藏显示按钮

来自分类Dev

错误:如何在隐藏和显示之间切换

来自分类Dev

jQuery切换以显示和隐藏内容

来自分类Dev

jQuery隐藏和显示切换脚本

来自分类Dev

jQuery切换按钮图像和Div显示/隐藏

来自分类Dev

如何在隐藏和显示之间切换?

来自分类Dev

在 jquery 中隐藏和显示之间切换

来自分类Dev

悬停时相互切换的元素

来自分类Dev

在滚动条上显示/隐藏元素一定宽度,切换其他宽度

来自分类Dev

隐藏激活的子菜单(切换)

来自分类Dev

jQuery切换隐藏div元素

来自分类Dev

jQuery .each()切换隐藏元素

来自分类Dev

在 LinkedList 上的元素之间转换和切换

来自分类Dev

iPad的显示/隐藏功能切换

来自分类Dev

在JPanel之间切换(隐藏/显示)

来自分类Dev

切换显示/隐藏Divs

来自分类Dev

使用切换jQuery显示/隐藏

来自分类Dev

智能表列显示/隐藏切换

来自分类Dev

切换按钮-显示/隐藏信息

来自分类Dev

iPad的显示/隐藏功能切换

来自分类Dev

切换显示/隐藏问题

来自分类Dev

隐藏显示切换按钮图像