Question

我在主div中有这么多div，很难精确选择div。假设像这样：

<div id="main">
  <div>
   <div></div>
   <div>
     <div>
       <div>
       <div class="myclass">
       </div>
.....
</div>

因此，通过我的标记，我可以选择以下类：.myclass

首先，我要删除类myclass，如下所示：$('.myclass').removeClass('myclass');

接下来我要添加添加相同的类

所以我试过这样：

$('.thisclass').addClass('myclass').removeClass('thisclass');
$('.myclass').addClass('thisclass').removeClass('myclass');

但在开/关点击功能

内

你可以在this fiddle中看到没有做我想做的事。

所以我的关键问题是如何在点击功能之后回滚上一课程。我需要删除上一个课程，并在点击后删除。

就像mouseenter和mouseleave一样，但我完全需要（'click'）

Answer 1

可能会帮助你

$('#clickthis').on('click', function(){
    $('.thisclass, .myclass').toggleClass('myclass thisclass');

});

检查here

Answer 2

你的意思是这样的：

$('#clickthis').on('click', function(){
    $('.thisclass').addClass('myclass').removeClass('thisclass');

//call this function later, after the 'click' event has been handled :
    setTimeout(function(){
        $('.myclass').addClass('thisclass').removeClass('myclass');
    }, 0);
});

你不应该使用setTimeout，你应该使用.animate()函数的complete回调：

$(...).animate( ...,  function(){
    //this function will be called once the animation is finished

    $('.myclass').addClass('thisclass').removeClass('myclass');
    // add any action you want to take on animation's end
})

所有jQuery的effect functions（例如：fadeIn，slideToggle等等......）接受complete回调。

点击功能后回滚类

2 个答案: