jquery 将alert放在animate外面时,未等动画完成便弹出alert的深层原因是?


   
  <html>
  
<head>
<script src="jquery-1.7.2.js" type="text/javascript"></script>
<style>
.divStyle{
height:200px;
width:200px;
border:1px solid #000000;
}
</style>
</head>
<body>
<div class="divStyle">
为什么alert放在animate里面,会等动画完成后弹出;
而将alert放在animate外面时,未等动画完成,便弹出?这里面深层次原因是什么?
</div>

<script>
$('.divStyle').animate({height:600, width:1500}, 1500,function(){
alert('动画完成后,弹出');
});
//alert('动画未完成,便弹出');
</script>
</body>
</html>

jquery 编程语言

Yuukimi 13 years, 3 months ago

放在里面是回调函数,动画完成后会调用该函数:

写成这样可能容易理解

   
  $('.divStyle').animate({height:600, width:1500}, 1500,fun);
  

function fun(){
alert('动画完成后,弹出');
}

对于 alert('动画未完成,便弹出'); 这个问题是因为 jquery 的animate 主要实现是通过定时器来完成了,比如setTimeout() 执行的时时候不会照成程序的阻塞。
所以不会等待 动画完成 再继续执行下边的代码。。

Kami@ answered 13 years, 3 months ago

Your Answer