slideToggle() 可以检测 SlideUp 还是 SlideDown？

Posted 2023-02-25

【中文标题】slideToggle() 可以检测 SlideUp 还是 SlideDown？

【英文标题】：slideToggle() can detect SlideUp or SlideDown?

【发布时间】：2013-10-29 11:39:50

【问题描述】：

我知道hover() 具有handIn 和handOut 的默认设置，但是我是否可以在SlideToggle 中检测到slideUp 和SlideDown？

有这样的代码：

$("#divName").slideToggle(function()//when slideUp, do something,
                          function()//when slideDown, do something);

我尝试了这段代码但没有运气，你们认为这有时会让事情变得更容易吗？

【问题讨论】：

slideToggle 只需要持续时间和回调即可完成。 API 并非按照您的预期工作。但是你可以使用toggle来实现这个效果，试试看吧

@RaviHamsa toggle() 的工作方式类似于 slideToggle() 但动画效果

我使用的切换版本已从 JQuery 中删除，这里有更多信息***.com/questions/14338078/…

【参考方案1】：

slideToggle 不允许将其作为默认设置，但编写自己的版本很容易。像这样的东西可以作为你的替代处理程序：

$('#divTrigger').click(function ()  // Or bind to any other event you like, or call manually

    var $t = $('#divToSlide');

    if ($t.is(':visible')) 
        $t.slideUp();
        // Other stuff to do on slideUp
     else 
        $t.slideDown();
        // Other stuff to down on slideDown
    
);

同样，如果您希望在 slideUp 或 slideDown 之后发生操作，您可以将它们放入回调中，例如 $.slideUp(300, function() // Callback here);。

【讨论】：

您可以将 var $t = $(this) 替换为您实际想要操作的 div 的其他选择器，例如。 var $t = $('#divToSlide');我会更新答案。

这里还有一个问题，当我需要点击一个按钮并使用slideToggle()时，它不会直接连接到目标div，$("#button").click(function() $("divName").slideToggle();)，在这种情况下我怎样才能达到同样的效果呢？似乎是：可见没有帮助，使 JSFiddle，秒.​​..

现在可以使用了，感谢更换。但仍然认为他们可以将函数构建到源代码中：P

你可以做一个扩展，或者分叉 repo 并添加代码？你永远不会知道，Resig 和他的团队可能会接受并使用它；）

【参考方案2】：

如果你检查幻灯片的状态并制作比函数呢？

$("#divName").slideToggle(function()
    var check=$(this).is(":hidden");

    if(check == true)
    
     //do something
    
);

【参考方案3】：

你总是可以保留一个标志，因为在纯 jQuery 中没有方法。假设#divName 不可见，

var toggle_flag = 0;

$('#divName').click(function () 

   $('#myelement').slideToggle();

   if(toggle_flag==0)
      //code for slide down
      toggle_flag=1;
   else
      //code for slide up
      toggle_flag=0;
   

);

如果#divName 已经可见，您可以使用var toggle_flag=1; 启动并使用此代码。