jQuery添加类时如何保持原有类名

Question

所以我有一些jQuery代码，它可以展开菜单，当我悬停在展开的DIV上时，我需要添加一个hover类。我需要保持菜单项上的悬停效果处于活动状态。

问题是即使DIV消失，它仍然保持在那里 - 我尝试使用removeClass，但是它会在我滚动到菜单选项DIV上时立即删除。

我在JsFiddle上有一个示例：http://jsfiddle.net/pCTXq/3/ 以下是jQuery代码：

$(document).ready(function() {
    $(".menu_item, .menu_options").hover(function() {
    $(this).addClass('hover');
        $(".menu_options").stop(true, true).slideDown(400);
    }, function() {
        $(".menu_options").stop(true, true).delay(10).slideUp(400);
    });

});

我看了一下这篇文章 jquery hover().addClass() problem，但似乎没有多大帮助。

提前感谢你的帮助。

编辑。我刚注意到在JSfiddle上它似乎也将hover类添加到了menu_options - 但是当我在浏览器中测试实际脚本时，并不是这种情况。

- AppleTattooGuy

---

我刚刚匆忙地写了这个，但也许这就是你想要实现的：http://jsfiddle.net/pCTXq/6/ - user1477388

Answer 1

编辑：

查看此代码片段以获取更新的答案

---

如果我正确理解了你的问题，你需要在悬停时移除类：

$(document).ready(function() {
    $(".menu_item, .menu_options").hover(function() {
    $(this).addClass('hover');
        $(".menu_options").stop(true, true).slideDown(400);
    }, function() {
        $(this).removeClass('hover');
        $(".menu_options").stop(true, true).delay(10).slideUp(400);
    });
    
});

- What have you tried

---

谢谢你的回答 - 我尝试过了，但是它会在我进入menu_options div（下拉菜单）时立即将类删除。我需要它在我停留在该div上时保持不变，并在离开时删除。 - AppleTattooGuy

@JamesLeist 说实话，你的意思不太清楚。你想在哪个 div 上添加这个 class？并且你想在什么时候移除这个 class？ - What have you tried

所以menu_item div需要显示悬停效果，当我滚动到menu_options时，悬停效果需要保持在menu_item上，然后当我滚出menu_options时，悬停效果需要消失 - 目前它仍然停留在那里。 - AppleTattooGuy

非常感谢您的帮助，但我现在想我已经明白了 :-) - AppleTattooGuy

@JamesLeist 请查看修改后的fiddle，还不确定那是否是你想要的？ - What have you tried

Answer 2

利用 slideUp 的第二个参数。完成后，然后删除该类。像这样：

$(document).ready(function() {
    $(".menu_item, .menu_options").hover(function() {
        $(this).addClass('hover');
        $(".menu_options").stop(true, true).slideDown(400);
    }, function() {
        $(".menu_options").stop(true, true).delay(10).slideUp(400, function( {
            $(".menu_item, .menu_options").removeClass('hover')
        });
    });
}

保存在您的 JSFiddle 中：http://jsfiddle.net/pCTXq/9/

因此，基本上，在悬停时（或者实际上更合适的是鼠标进入时）添加悬停类，并在滚动到顶部之前不要删除它。您可能需要调整要添加到哪里（从外观来看，只需 $(".menu_item") 可能就可以了），但这是一般思路。

- Scott Mermelstein