jquery 特定于悬停时显示按钮

发布于 2024-09-04 03:50:42 字数 631 浏览 2 评论 0原文

我有一个应用程序通过循环创建一堆 div。

每个 div 都有“product”类

，因此看起来

<div class="product">
       !.....stuff here ....!
       <div class="show_on_hover">...buttons here... </div>
</div>

每页大约有 12 个相同的 div。

我想将鼠标悬停在特定的 div 上并显示最初设置为 display:none 的特定“show_on_hover”div。

$('.product').hover(function() {
    $(.show_on_hover).show();
    },
    function () {
        $(.show_on_hover).hide();
    }
);

这就是我到目前为止所拥有的，但它将显示页面上的所有 .show_on_hovers，所以我想知道如何仅获取您将鼠标悬停在上面的特定内容来显示。当您将鼠标悬停在任何评论上时，YouTube 上就会出现这种效果，并且会弹出一些评论工具。

谢谢！

原文

I have an application creating a bunch of divs through a loop.

Each div has the class "product"

so it looks like

<div class="product">
       !.....stuff here ....!
       <div class="show_on_hover">...buttons here... </div>
</div>

so there are about 12 of these same divs per page.

I would like to hover over a specific one and show the specific "show_on_hover" div which is initially set to display:none.

$('.product').hover(function() {
    $(.show_on_hover).show();
    },
    function () {
        $(.show_on_hover).hide();
    }
);

That is what I have so far but it will show ALL of the .show_on_hovers on the page so I am wondering how to get only the specific one you have moused over to show. This effect is seen on youtube when you mouseover any of the comments, and some comment tools pop up.

Thanks!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

一张白纸 2024-09-11 03:50:42

find 将在其中找到您的 .show_on_hover div悬停的 .product。试试这个：

$('.product').hover(function() {
        $(this).find('.show_on_hover').show();
    },
    function () {
        $(this).find('.show_on_hover').hide();
    }
);

find will find your .show_on_hover divs inside the hovered .product. Try this:

$('.product').hover(function() {
        $(this).find('.show_on_hover').show();
    },
    function () {
        $(this).find('.show_on_hover').hide();
    }
);

回复收藏 0 原文