Javascript 再次将当前菜单链接设置为“返回”；主动的；一旦通过菜单的导航停止

好吧，也许你不能从标题中理解太多，所以我会在这里试着解释一下。 基本上我有一个导航，如下所示：

<ul class="primaryNav"> 
  <li class="nav1"><a href="#" class="inactive"  title="About us">About us</a></li> 
  <li class="nav2"><a href="#" class="inactive"  title="Our world">Our world</a></li>
  <li class="nav3"><a href="#" class="active"  title="Active menu link">Active page</a></li>
</ul>

现在我在“活动页面”页面，“活动菜单链接”处于活动状态，正如您所看到的（该类由我在每个页面上手动设置）。 用户可以浏览其他菜单（将它们悬停），它们变为活动菜单，我的“活动菜单链接”变为非活动菜单，等等。（通过jQuery）

嗯，我想做的是，一旦用户停止在我的菜单中导航，并将鼠标光标移到导航容器外（比如说），将“活动菜单链接”设置回“活动”，它最初是活动的，可能会有一些超时

希望我对自己想要实现的目标足够清楚

谢谢， 阿德里安

类似于：

var resetMenu = function() {
    $('li.active').attr('class','active').siblings().attr('class','inactive');
};
var to;

$('ul').bind('mouseout', function() {
    window.clearTimeout(to);
    to = window.setTimeout(resetMenu, 1000);
});

---

我在这里使用

attr（）

，而不是根据您的示例添加/删除类名。在“重置”菜单之前，您可以更改1000，以等待更多/更少的时间。

我不完全清楚您想做什么，但听起来您在寻找，当鼠标进入匹配的元素时会触发，当鼠标离开时会触发回调函数

$('ul.primaryNav').hover(function() {
    // do stuff when the mouse enters the <ul> 
  }, 
  function() {
    // do stuff when the mouse leaves the <ul>
});

$（'ul.primaryNav'）。悬停（函数（）{
//当鼠标进入

}, 
函数（）{
//当鼠标离开

});

我怀疑您可能打算使用

和

等-id而不是类来唯一标识这些元素

---

//do stuff

的确切含义取决于您要查找的具体内容，但可能只是添加和删除一个

活动的

类，而不是使用一个

非活动的

类

我不仅仅是在寻找jQuery中的.hover（）事件，它只不过是个小问题

我已经在使用jQuery.hover（）事件将类“active”添加到当前悬停的链接中，并将类“inactive”添加到其他链接中

但是在活动页面中，我手动设置了“活动”类，我希望当用户停止通过我的菜单导航时，该类再次处于活动状态。我的意思是，当我玩菜单并悬停链接时，它会做我告诉过你的事情（将类活动添加到当前，将类非活动添加到其他）-当我将鼠标移出导航区域时，我希望“活动”类再次“转到”我第一次进入该页面时拥有该类名的初始链接

---

我也有一些子菜单，它们显示在hover上，但我想这与我的问题不太相关。

这应该行得通。若你们需要解释，只需对答案进行评论

var as;
var ul = $('ul.primaryNav').mouseout(function() {
    toogle(
        as.filter('.active'),
        as.filter(function() {
            return $(this).data('originalActive') === true;
        })
    );
});

as = ul.find('a');
//remember which one was original active
as.filter('.active').data('originalActive', true);

function toogle(ina, act) {
    ina.removeClass('active').addClass('inactive');
    act.removeClass('inactive').addClass('active');
};

as.mouseover(function() {
    //make current active, inactive others
    toogle(as.filter('.active'), $(this));
});

---

听起来他在寻找

mouseenter

/

mouseleave

，而不是

blur

。听起来你有两种不同的状态要跟踪-

悬停（鼠标悬停）和
活动（当前页面）。这将简化代码，只需在离开导航时删除
悬停
状态，并恢复为
活动
如何存储初始“活动”状态类，以便在鼠标移出后将其重新添加到活动链接中，以及如何确定我所在区域的坐标以了解鼠标的位置？？再次感谢您的回答，但我已经用其他方法进行了操作（包括一些php，以了解我在哪一页上），它非常有效。谢谢大家。主题结束。