JQuery在同一个循环中显示()和隐藏()

Question

我有下面的代码，我需要显示或隐藏面板。我的问题是，该节目()只适用于另类点击。

var allPanels = $(".panel");
allPanels.hide(2000);
allPanels.show();

我想知道show()不能一致工作的原因。

Answer 1

这不起作用，因为您在.hide(2000)中设置了时间。你必须以下列方式书写：

<div class="panel" >This is a DIV</div>
<button type="button" class="buttonClick" >Click me</button>

JQUERY

$(document).ready(function (e) {
    $(document).on('click', '.buttonClick', function () {
        var allPanels = $(".panel");
        allPanels.hide(2000, function(){
            allPanels.show();
        });
    });
});

Answer 2

一种更容易的方法是在启动另一个动画之前对当前的动画进行.stop()。

var allPanels = $(".panel");
allPanels.hide(2000);
allPanels.stop().show();

这样，您就不必将代码放在回调中。但是请注意，这样做将显式地暂停动画，忽略其当前状态。

Answer 3

当我从

var allPanels = $(".panel");
allPanels.hide(2000);
allPanels.stop().show();

变到

var allPanels = $(".panel");
allPanels.hide();
allPanels.stop().show();`enter code here`

开始起作用了。隐藏和显示工作无缝。谢谢。但是，谁能说出为什么隐藏和显示的时间不起作用。