slideDown无法正常工作

Question

为什么这不起作用：

window.setTimeout(function() {
if($(".alert").is(":hidden")) {
  $(".alert").slideDown(500, function() {
    window.setTimeout(function() {
      $(".alert").fadeTo(500, 0).slideUp(500, function() {
          $(this).remove(); 
      });
    }, 4000);
  });
}  
}, 1000);

HTML：

<div id="login-error" class="container alert alert-danger" role="alert" hidden>
        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <strong>Error!</strong> Invalid login or password!
      </div>

它没有向下滑动，并且在4秒钟后删除了该元素。

如何解决，请提供帮助。谢谢！

Answer 1

在JS小提琴中正常工作...

https://jsfiddle.net/d186qkfb/

$(document).ready(function() {
   window.setTimeout(function() {   
    if($(".alert").is(":hidden")) {
      $(".alert").slideDown(500, function() {
        window.setTimeout(function() {
          $(".alert").fadeTo(500, 0).slideUp(500, function() {
              $(this).remove(); 
          });
        }, 4000);
      });
    }  
  }, 1000);
});