javascript - 如何有两个fadin，delay和fadeout一个接一个？

Question

当我单击一个按钮时我该怎么办它会首先.fadeIn(0); .dealy(2000); .fadeOut(600); and say "Validating..."然后它会说"Success fully log in"并重定向到 index.php？

我确实尝试过，但没有奏效：

function save() {
    $('#save_first').html('Validating...');
    $('#save_first').fadeIn(1);
    $('#save_first').delay(2000);
    $('#save_first').fadeOut(600);
    $('#save_second').html('Success fully log in!');
    $('#save_second').delay(2601);
}

HTML

header('Location: index.php');
        exit();

Answer 1

将它们堆叠起来，其余部分使用回调以及 setTimeOut 进行重定向

var loginUser = function(){

    $('#save_first').fadeIn(1).delay(2000).fadeOut(600, function(){
        $('#save_second').html('Success fully log in!');
        //Redirect after 2.6 seconds delay
        setTimeout(function() {
           window.location.href = "/index.php";
        }, 2600);
    });

};

然后每当您希望触发它时，只需执行以下操作：

loginUser();

点击“元素”触发：

$(element).click(loginUser);