Javascript 我需要使用鼠标悬停上的选择器和鼠标悬停外的变量集来查找特定链接

这对我来说很难解释，所以我会尽力的。这是代码：

$('#navibar a').hover(function(){
    var position = $(this).position(); 
    var width = $(this).width();
    $('#underliner').css({'width': '' + width + '','left': position.left});
    //$('#underliner').show("slide", { direction: "left" }, 100);
    $('#underliner').stop().animate({opacity: 1}, 30).show();
}, function () {
    var homePos = $(this).find(attr(activePageHref)).position();
    var homeWidth = $(this).find(attr(activePageHref)).width();
    //$('#underliner').css({'width': '' + homeWidth + '','left': homePos.left});
    //$('#underliner').show("slide", { direction: "left" }, 100);
    //$('#underliner').stop().animate({opacity: 1}, 30).show();
    alert(activePageHref);
});

activePageHref在此之外设置为已单击的页面。在警报中，它正确地显示了例如，让我们只说它的值是home。我需要以某种方式将underliner.css的位置和宽度设置为鼠标悬停时选择的导航中的页面链接，那么有没有办法找到其他“a”并使用它们？希望在代码中，我想做的事情是显而易见的。这是我的标记：

<ul id="navibar">
            <li><a href="home">Home</a></li>
            <li><a href="products">Products</a></li>
            <li><a href="games">Games</a></li>
            <li><a href="store">Store</a></li>
            <li><a href="support">Support</a></li>
            <li><a href="community">Community</a></li>
        </ul>

---

另外，我知道第一段代码是大错特错的，这只是我决定在这里发布之前出于愤怒和绝望所做的最后一件事。

使用属性选择器查找href为activePageHref的链接

$('#navibar a').hover(function(){
    var position = $(this).position(); 
    var width = $(this).width();
    $('#underliner').css({'width': '' + width + '','left': position.left});
    //$('#underliner').show("slide", { direction: "left" }, 100);
    $('#underliner').stop().animate({opacity: 1}, 30).show();
}, function () {
    var homePos = $(this).parents('#navibar').find('a[href="'+activePageHref+'"]').position();
    var homeWidth = $(this).parents('#navibar').find('a[href="'+activePageHref+'"]').width();
    //$('#underliner').css({'width': '' + homeWidth + '','left': homePos.left});
    //$('#underliner').show("slide", { direction: "left" }, 100);
    //$('#underliner').stop().animate({opacity: 1}, 30).show();
    alert(activePageHref);
});

---

使用属性选择器查找href为activePageHref的链接

$('#navibar a').hover(function(){
    var position = $(this).position(); 
    var width = $(this).width();
    $('#underliner').css({'width': '' + width + '','left': position.left});
    //$('#underliner').show("slide", { direction: "left" }, 100);
    $('#underliner').stop().animate({opacity: 1}, 30).show();
}, function () {
    var homePos = $(this).parents('#navibar').find('a[href="'+activePageHref+'"]').position();
    var homeWidth = $(this).parents('#navibar').find('a[href="'+activePageHref+'"]').width();
    //$('#underliner').css({'width': '' + homeWidth + '','left': homePos.left});
    //$('#underliner').show("slide", { direction: "left" }, 100);
    //$('#underliner').stop().animate({opacity: 1}, 30).show();
    alert(activePageHref);
});

---

首先，您可以通过类似event.target的方式选择所选的“a”； 其次，将activeClass添加到目标中； 第三，通过选择器获取其他a，例如$ulnavibar li a:not.activeClass 在这里，您将获得数组中的非活动a，您可以通过$.each遍历这些a

---

希望它能对您有所帮助。

首先，您可以通过类似event.target的方式选择所选的“a”； 其次，将activeClass添加到目标中； 第三，通过选择器获取其他a，例如$ulnavibar li a:not.activeClass 在这里，您将获得数组中的非活动a，您可以通过$.each遍历这些a

---

它可能会帮你一点忙。

它说homePos为空，而我肯定activePageHref不是通过注释所有内容并使用警报来实现的。取消悬停函数第3行和第5行的注释。我刚刚意识到这不是navibar请参见编辑，我只是用代码替换了代码中的行以查找所需的元素。我也应该捕捉到这一点，但仍然是空的。另外，对于任何可能前来观看的人，activePageHref之后有一个“不合适的地方”。@GrantKesslerJr我需要使用.parents而不是.parent，因为navibar是祖先，而不是父项。@GrantKesslerJr您将href的值更改为，这就是为什么它没有被选中，如果只有当前项有href as，则返回null，然后将其用作选择器a[href=]它说homePos是空的，而我肯定activePageHref不是通过注释所有内容并使用警报来确定的。取消悬停函数第3行和第5行的注释。我刚刚意识到这不是navibar请参见编辑，我只是用代码替换了代码中的行以查找所需的元素。我也应该捕捉到这一点，但仍然是空的。另外，对于任何可能前来观看的人，activePageHref之后有一个“不合适的地方”。@GrantKesslerJr我需要使用.parents而不是.parent，因为navibar是祖先，而不是父项。@GrantKesslerJr您将href的值更改为，这就是为什么它没有被选中，如果只有当前项有href as，则返回null，然后将其用作选择器a[href=]我应该在一段时间前使用类，现在我正在努力避免它，这样我就不必重写一些已经有效的东西。我应该在一段时间前使用类，现在我正在尝试避免它，这样我就不必重写一些已经有效的东西。