jquery之动画animate底层原理猜测

本文介绍如何在jQuery的animate方法完成后执行特定操作,通过实例演示了如何阻止动画重复触发及如何正确更新控制变量。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

jQuery中animate()方法使用时,如果想像一般的程序那样在程序进行到最后的时候执行一句条件语句变量的更变:

html代码:

<div id="dv">

  <div id="d2"></div>

</div>

<button id="move">移动</button>

css:div{

  display:none;

  position:relative;

  left:0px;

}

js代码:

var disp=0;

$("#move").click(function(){

  if(disp==0){

   //在本次动画执行完成之前不允许下次动画开始,所以更改disp的值

  disp=1;

   $("#dv").animate({

    left:20,

    },{

     duration:2000 

    });

  }

  //一般在程序执行到这里时说明上面的程序都已经执行完毕了,可是动画并不是这样,在这里更改disp的值,

  disp=0;

  //这时disp的值在动画执行前已经更改了,因为在本次程序执行完毕前,动画语句都在等待状态。所以这样改变判断条件是不行的

});

转载于:https://www.cnblogs.com/pilarQ-Garden/p/5185017.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值