单击功能后的回滚类 [英] Rollback class after the click function

问题描述

我的主div中有很多div，很难准确选择该div. 假设像这样:

I have so many div inside the main div and It's difficult to select exactly that div. Suppose like this:

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

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

So with my markup I could select the class just with: .myclass

首先，我必须将其删除为myclass类，如下所示:$('.myclass').removeClass('myclass');

Firstly I've to remove it class myclass like this: $('.myclass').removeClass('myclass');

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

Next I've to add add the same class

所以我尝试这样:

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

但是在开/关点击功能内

But inside the on/off click function

您可以在此小提琴中看到这，它没有执行我想要的操作.

You can see in this fiddle which is not doing what I want.

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

So my key question is that how can I roll back the previous class after the on click function. I need to remove the previous class and after the click.

就像mouseenter和mouseleave一样，但是在on('click')之后我非常需要

just like mouseenter and mouseleave but I extremly need after on('click')

推荐答案

您的意思是这样的吗:

$('#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，而应使用complete回调="nofollow"> .animate() 函数:

---

You should not use setTimeout, you should use the complete callback of the .animate() function :

$(...).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的效果函数(例如: slideToggle ，等等...)接受complete回调.

All of jQuery's effect functions (e.g : fadeIn, slideToggle, etc ...) accept a complete callback.

这篇关于单击功能后的回滚类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！