jquery - 不明白它是如何工作的

Question

当我们使用 Css 和 jQuery 在移动 View 和切换后切换菜单时，如果我们展开，整个菜单 div 在桌面 View 中隐藏。所以我们使用的解决方案:

$(function(){
  $(".nav-btn").click(function(){
    $(".nav").toggle(400, function(){
        $(this).toggleClass("expand").css('display','');
    });
  });
});

我不明白该回调函数如何使菜单在桌面 View 中再次可见。

Answer 1

toggle 中的第一个参数定义了决定动画运行时长的字符串或数字。因此，当您提供 400 时，它只会停留那么多时间(以毫秒为单位)。默认值始终为 400。

持续时间以毫秒为单位；较高的值表示较慢的动画，而不是较快的动画。可以提供字符串“快”和“慢”来分别指示 200 和 600 毫秒的持续时间。

下面是一个简单的例子。它的作用是，当您单击 nav-btn 时，它将应用回调中定义的 css，等待 400 毫秒。

$(".nav-btn").click(function(){
  $(".nav").toggle(400, function(){
      $(this).toggleClass("expand").css('display','');
  });
});

.expand{
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='nav-btn'>
 <div class='nav'>someContent</div>
</div>