jQuery中is方法防止动画重复执行、停止执行的方法

定义和用法

is() 根据选择器、元素或 jQuery 对象来检测匹配元素集合,如果这些元素中至少有一个元素匹配给定的参数,则返回 true。

语法

.is(selector)

与其他筛选方法不同,.is() 不创建新的 jQuery 对象。相反,它允许我们在不修改 jQuery 对象内容的情况下对其进行检测。这在 callback 内部通常比较有用,比如事件处理程序。

返回 false,因为 input 元素的父元素是 p 元素:

  var isFormParent = $("input[type='checkbox']").parent().is("form");
  $("div").text("isFormParent = " + isFormParent);

典型的语法:

$(selector).hide(speed,callback)

当需要动画结束后才去执行特定语句,这里用callback能实现。更复杂的情况我觉得用判断动画是否正在执行或是否执行完成,会更妥当。

防止重复执行动画避免页面混乱

可以先判断一下元素是否处于动画中。
如:

if(!$(".content").is(":animated")){
//元素不处于动画中执行。
}

在动画事件执行前加上一个判断,比如产生动画效果目标的是target,那么要加上判断

if(!target.is(":animated")){},

举例:

if(!$(selector).is(":animated")){
  $(selector).hide(speed,callback)
}

这可以保证动画只会在上一次动画结束后才会执行,保持动画的完整性,但是在短动画情况下,连续点击时会有反应迟钝的感觉。
而用stop可以强制动画当前执行,直接结束,回到初始状态或结束状态,这会造成动画脱节感,但反应迅速。权衡使用。

$("#div").stop();//停止当前动画,继续下一个动画 
$("#div").stop(true);//清除元素的所有动画       
$("#div").stop(false, true);//让当前动画直接到达末状态 ,继续下一个动画
$("#div").stop(true, true);//清除元素的所有动画,让当前动画直接到达末状态

时间: 2024-12-04 00:32:01

jQuery中is方法防止动画重复执行、停止执行的方法的相关文章

Linux系统中重复执行命令的方法小结

  普通的重复执行命令 实际操操作过程中,经常会遇到重复执行同一命令,以观察其结果变化的情况,以前经常是上下键加回车,或是Ctr+p然后回车的方式. 现在告诉大家一个好用的命令--watch,它可以全屏执行这个命令,并显示执行结果.例如: 代码如下: #watch uptime #watch -t uptime #watch -d -n 1 netstat -ntlp #watch -d 'ls -l | fgrep goface' //监测goface的文件 #watch -t -differ

jQuery中ajax的使用与缓存问题的解决方法

本篇文章主要介绍了jQuery中ajax的使用与缓存问题的解决方法.需要的朋友可以过来参考下,希望对大家有所帮助 1:GET访问 浏览器 认为 是等幂的 就是 一个相同的URL 只有一个结果[相同是指 整个URL字符串完全匹配] 所以 第二次访问的时候 如果 URL字符串没变化 浏览器是 直接拿出了第一次访问的结果   POST则 认为是一个 变动性 访问 (浏览器 认为 POST的提交 必定是 有改变的)   防止 GET 的 等幂 访问 就在URL后面加上 ?+new Date();,[总之

JQuery中DOM加载与事件执行实例分析_jquery

本文实例讲述了JQuery中DOM加载与事件执行原理.分享给大家供大家参考.具体分析如下: JavaScript和HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的.当文档或者它的某些元素发生某些变化或操作时,浏览器会自动生成一个事件.例如当浏览器装载完一个文档后,会生成事件:当用户单击某个按钮时,也会生成事件.虽然利用传统的JavaScript事件能完成这些交互,但jQuery增加并扩展了基本的事件处理机制.jQuery不仅提供了更加优雅的事件处理语法,而且极大地增强了事件处理能

JQuery中的事件以及动画

原文:JQuery中的事件以及动画                嘿嘿,今天学习了JQuery的事件以及动画,感觉即将学习完JQuery,在回忆起上周学习的JavaScript,感觉好多刚刚学习的知识点都记得模 糊啦,这个是很让失望的,这里只说明了一点,课是听过啦,但是没有好好的练习,于是就加快了刚学习的知识的遗忘力度.在一周的时间里学习了JavaScript, 那时间没感觉可得节奏很快,现在顿时发现课真的是快啦,我需要认真的对待,好好的在练习练习,而写发现最近的态度也有很大的问题,总是在赶今天

JQuery中的事件及动画用法实例_jquery

本文实例讲述了JQuery中的事件及动画用法.分享给大家供大家参考.具体分析如下: 1.bind事件 复制代码 代码如下: <script src="script/jquery-1.7.1.min.js"></script> <script> $(function () { $("#divid h5.head").bind("click", function () {  //bind事件,其中包含三个参数,第一

关于jquery中动态增加select,事件无效的快速解决方法_jquery

近来做项目,用的jquery1.6.2库,当动态增加div 及select时,事件却不起作用. 查了一些资料,发现bind事件:向匹配元素附加一个或更多事件处理器.而live事件:为当前或未来的匹配元素添加一个或多个事件处理器. 其资料如下: [bind和live的区别] live方法其实是bind方法的变种,其基本功能就同bind方法的功能是一样的,都是为一个元素绑定某个事件,但是bind方法只能给当前存在的元素绑定事件,对于事后采用JS等方式新生成的元素无效,而live方法则正好弥补了bin

JQuery中使用Ajax赋值给全局变量异常的解决方法

 本篇文章主要是对JQuery中使用Ajax赋值给全局变量异常的解决方法进行了详细的介绍,需要的朋友可以过来参考下,希望对大家有所帮助 我们在用JQuery的Ajax从后台提取数据后想把它赋值给全局变量,但是却怎么都赋不进,为什么呢?   原因其实很简单,我们用的Ajax是异步操作,也就是说在你赋值的时候数据还没提取出来,你当然赋不进去,所以只要改成同步操作就行~   方法1:先设置同步在进行Ajax操作      代码如下: //在全局或某个需要的函数内设置Ajax异步为false,也就是同步

Win7下wps表格中禁止单元格输入重复数值的设置方法

  Wps是一款办公软件,一些用户需要经常使用wps制作一些数据资料,比如学号.员工编号等,而这些数据都有着不能重复的特点,那么要如何禁止在wps的表格中输入重复数值呢?其实只要简单设置一下就可以了,下面跟大家带来Win7下在wps表格中禁止单元格输入重复数值的设置方法如下. 1.首先我们打开win7系统下WPS软件表格软件,并新建一个表格.   2.选中需要输入数值的行或列,在此小编以选择B列为例进行讲解.大家可以根据自己的表格输入的需要进行选择.   3.选择后点击"重复项";  

jQuery validate插件实现ajax验证重复的2种方法_jquery

本文实例讲述了jQuery validate插件实现ajax验证重复的2种方法.分享给大家供大家参考,具体如下: jquery validate 经过这种多年的改良,已经很完善了.它能满足80%的验证需要,如果validate自带的功能,不能满足我们需求,它提供了addMethod来扩展功能.下面就举个小例子来说明一下addMethod的用法. 完整demo实例代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//