jQuery之间的每个toggleclass延迟

我做了一个（相当复杂）的解决方案，我有4个菜单项从侧面弹出/弹出，我通过切换一个类来实现。jQuery之间的每个toggleclass延迟

$('.menuitem').toggleClass('show');

它工作的很好，但客户现在希望它“滑出”。我想我可以让他快乐，如果我可以在每个切换之间创建一个延迟，但我找不到一个好方法来做到这一点。在实践中，我希望每个菜单项都切换到类别，但在下一个toggleClass之前可能会延迟250毫秒。

编辑 - 显然延迟功能不会与切换，只与动画。

2015-11-04 Paul

似乎没有细节的XY问题。什么是show类？你是什么意思*流行/流行*？如何加入延迟会导致它突然滑出*？ – Abhitalks

看起来像一个简单的问题应该保持简单。无论如何，我从Manwal得到了正确的答案 – Paul

足够公平的保罗。很好，你找到了你的解决方案。如果您发现它有用，您可能想要接受该答案。 :) – Abhitalks

考虑这下面的代码：

$('.menuitem').each(function(i) { 
    var elm=$(this); 
    setTimeout(function() { 
     elm.toggleClass('show'); 
    }, i * 250); 
});

See it in action，在这个演示中，我有一个隐藏的潜水之一，延迟为1000毫秒。

2015-11-04 09:11:04 Manwal

必须等6分钟才能接受:) – Paul

什么：

$('.menuitem').toggleClass('show').delay(1000).toggleClass('hide');

2015-11-04 09:10:37 Jan

延迟不会与toggleClass一起工作，显然它只适用于动画 – Paul

@Paul我不知道，我的错误。 – Jan

您需要将代码放入队列中才能使用delay（），并且无论如何将一次处理所有元素集 –

我会在单独的事件中做$('.menuitem').toggleClass('show')。

例如<button onmousedown="$('.menuitem').toggleClass('show');" onclick="myfunc();">Fast Toggle</button>

如果您切换onmousedown事件的页面将与click事件触发之前切换渲染。

2016-07-22 16:35:39 bendyourtaxes

回答