在单个语句中添加类和删除类不起作用

Question

    $("button").click(function(){
        $("#p1").addClass("size").slideUp(2000).slideDown(2000).removeClass("size");
        /* p1 is a id of element, i want to add size class after that to remove it */
    });

Answer 1

您需要在slideDown()：

上将第二个语句作为回调函数

$("button").click(function(){
    $("#p1").addClass("size").slideUp(2000).slideDown(2000, function () {
      $(this).removeClass("size");
    });
});

或者更好的是，您还需要使用slideUp的回调函数！

$("button").click(function() {
    $("#p1").addClass("size").slideUp(2000, function () {
        // Execute this after 2 seconds of slideUp animation.
        $(this).slideDown(2000, function () {
            // Execute this after 2 seconds of slideDown animation.
            $(this).removeClass("size");
        });
    });
});

因为它们不应该并行发生，而是按顺序发生，每次完成后都会发生。

Answer 2

实际上他们正在添加和删除罚款，但它会立即发生。你需要加入一些延迟。

$("button").click(function(){
    $("#p1").addClass("size").slideUp(2000, function(){$(this).slideDown(2000 ,function(){ $(this).removeClass("size")})});
    /* p1 is a id of element, i want to add size class after that to remove it */
});