隐藏加载，在点击时添加一个类，然后用另一个类点击切换

Question

我有一个导航器，我希望在加载时隐藏。

然后我想在点击一个类=“nav-btn”

时向该导航添加一个'bounceIn'类

初次点击后，我希望它在'bounceIn'和'bounceOut'类之间切换

目前我刚刚使用了这个功能，然后在点击时反弹，删除了bounceIn并添加了bounceOut（忽略了动画类）。

$(document).ready(function() {

  $('nav').addClass('animated bounceIn');

  $("nav").click(function () {
      $(this).removeClass('bounceIn');
      $(this).addClass('bounceOut');
  });

});

如何轻松实现我的需求？

Answer 1

您可以使用toggleClass方法。

$('.nav-btn').click(function () {
    $('nav').toggleClass('bounceIn bounceOut');
});