Javascript .removeClass（）jQuery立即添加删除的类

我这里有个问题：

当我点击

contact o

按钮时，它是正常的，并且可以正常打开。但是，当我单击

volver

时，它会删除这些类并立即再次添加它们。我注意到了这一点，当我在执行之间放置一些警报时。 你可以在我的JSFIDLE中看到它

这是我正在使用的JS

$(function () {
    $("div.arrastre").on("click", function () {
        $(this).find("div.bloque").addClass("rotated");
        var esto = $(this);
        setTimeout(function () {
            esto.find("div.bloque div.back").addClass("agrandar");
            esto.addClass("agrandar")
        }, 100);
    });
});

$(function () {
    $("div#volver").on("click", function () {
        var esto = $(this);
        setTimeout(function () {
            esto.closest("div.bloque").removeClass("rotated");
            if (esto.closest("div.back").hasClass("agrandar")) {
                esto.closest("div.back").removeClass("agrandar");
                alert("se supone que quité la clase agrandar en back ");
            };

            if (esto.closest("div.arrastre").hasClass("agrandar")) {
                esto.closest("div.arrastre").removeClass("agrandar");
                alert("se supone que quité la clase agrandar en arrastre");
            };
        }, 100);
    });
});

当您单击

div#volver

时，单击事件将被调度并冒泡到文档中，并在每次取消时触发

您触发了第一次设置在

div.arrastre

上的回调，因为它是

#volver

的父级

调用

setTimeout

，导致在单击

#volver

100毫秒后添加类

为了防止点击事件冒泡，您可以

返回false或
stopPropagation
：

$("div#volver").on("click",function(event){
    // your code
    event.stopPropagation();
    return false;
}

解决方案

注意：由于事件对齐，代码表现得很滑稽。
：）
为了预防起见，我添加了新的
settimeout
和jsut

希望htis能满足需要
：）

代码

//CAJAS DE CLICK 

$(function () {
    $("div.arrastre").on("click", function (e) {
        e.preventDefault();
        $(this).find("div.bloque").addClass("rotated");
        var esto = $(this);
        setTimeout(function () {
            esto.find("div.bloque div.back").addClass("agrandar");
            esto.addClass("agrandar")
        }, 100);
    });
});

$(function () {
    $("div#volver").on("click", function (e) {
        e.preventDefault();
        var esto = $(this);
        setTimeout(function () {
            esto.closest("div.bloque").removeClass("rotated");
            if (esto.closest("div.back").hasClass("agrandar")) {
                esto.closest("div.back").removeClass("agrandar");
                alert("se supone que quité la clase agrandar en back ");
            };

            if (esto.closest("div.arrastre").hasClass("agrandar")) {
                esto.closest("div.arrastre").removeClass("agrandar");
                alert("se supone que quité la clase agrandar en arrastre");
            };
        }, 200);
    });
});