使用 jquery every 在悬停时显示/隐藏

发布于 2024-12-12 02:53:25 字数 611 浏览 0 评论 0原文

我有几个与“myanchor”类的链接。我想为每个链接显示一个div（onmouseover）并隐藏（onmouseout）：

“link1”显示“div1” “link2”显示“div2” 。。。

我的代码不起作用：

$(document).ready(function () {
        var n = $(".myanchor").length;
        var arr = [];
        for (var i = 1; i <= n; i++) {
            arr[i] = i;
        };

        jQuery.each(arr, function () {
            $("#anchor" + this, "#div" + this).mouseover(function () {
                $("#div" + this).show();
            }).mouseout(function () {
                $("#div" + this).hide();
            });
        });
    });

谢谢。

原文

I have several links with class "myanchor".
I want to display a div for each link (onmouseover) and hide (onmouseout):

"link1" displays "div1"
"link2" displays "div2"
.
.
.

My code which isn't working:

$(document).ready(function () {
        var n = $(".myanchor").length;
        var arr = [];
        for (var i = 1; i <= n; i++) {
            arr[i] = i;
        };

        jQuery.each(arr, function () {
            $("#anchor" + this, "#div" + this).mouseover(function () {
                $("#div" + this).show();
            }).mouseout(function () {
                $("#div" + this).hide();
            });
        });
    });

Thanks.

分享到QQ

分享到微博

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

发布评论

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

指尖上的星空 2024-12-19 02:53:25

像这样的事情应该可以解决问题。我假设链接名称存储在链接的 id 属性中：

$(".myanchor").hover(function() {
    var id = $(this).attr("id");
    $("#div" + id.charAt(id.length - 1)).show();
}, function() {
    var id = $(this).attr("id");
    $("#div" + id.charAt(id.length - 1)).hide();
});

这是一个工作示例。这消除了对 each 循环的需要，因为 jQuery 方法往往应用于匹配集中的所有元素（在本例中，这是所有 .myanchor 元素）。使用 hover 比分别绑定到 mouseover 和 mouseout 稍微短一点，但最终结果是相同的。

Something like this should do the trick. I'm assuming the link names are stored in the id attribute on the links:

$(".myanchor").hover(function() {
    var id = $(this).attr("id");
    $("#div" + id.charAt(id.length - 1)).show();
}, function() {
    var id = $(this).attr("id");
    $("#div" + id.charAt(id.length - 1)).hide();
});

Here's a working example. This does away with the need for the each loop, because jQuery methods tend to be applied to all elements in the matched set (in this case, that's all the .myanchor elements). Using hover is just a little bit shorter than binding to mouseover and mouseout separately, but the end result is the same.

回复收藏 0 原文

囍孤女 2024-12-19 02:53:25

这应该有效：

$(document).ready(function () {
            $(".myanchor").each(function(i){
              $(this).mouseover(function () {
                    $("#div" + i).show();
                }).mouseout(function () {
                    $("#div" + i).hide();
                });
            });
        });

this should work:

$(document).ready(function () {
            $(".myanchor").each(function(i){
              $(this).mouseover(function () {
                    $("#div" + i).show();
                }).mouseout(function () {
                    $("#div" + i).hide();
                });
            });
        });

回复收藏 0 原文

~没有更多了~