Question

当我点击contacto按钮时，它可以正常打开。但是，当我点击volver时，它会删除这些类，而会立即再次添加它。当我在执行之间发出一些警报时，我注意到了这一点。你可以在我的jsfiddle中看到它。

这是我正在使用的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);
    });
});

Answer 1

单击div#volver时，将调度click事件并向文档冒泡，在每个ancester上触发。

您触发首次在div.arrastre上设置的回叫，因为它是#volver的父级。

调用

setTimeout，导致在点击#volver后100ms内添加该类。

为防止点击事件冒泡，您可以在设置的回调中return false;或stopPropagation：

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

Working fiddle

Answer 2

解决方案 http://jsfiddle.net/2S34N/

注意：由于事件已对齐:)，代码表现得很有趣我为了预防措施settimeout添加了新的e.preventDefault() 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);
    });
});

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

2 个答案: