Jquery中使用定时器setInterval和setTimeout
直接在ready中调用其他方法,会提示缺少对象的错误,解决方法如下:
方法1. 函数不在$(function(){....})内,setInterval第一个参数为"showAtuto"
<script type="text/javascript">
var t,n,count = 0;
$(function(){
t = setInterval("showAuto()", 1000);
})
function showAuto(){
$('#ind').html(count++);
}
</script>
方法2. 函数在$(function(){....})内,setInterval第一个参数为 showAuto写法
<script type= "text/javascript" > var t,n,count = 0; $(function(){ function showAuto(){ $( '#ind' ).html(count++); } t = setInterval(showAuto, 1000); }) </script> |
方法3、定时器中函数不能传参的解决方法
var num = 0;function slideRun(x){ scrollImg.animate({top:- h * x + "px" },{duration:500,queue: false }); $( ".slideNumber span" ).removeClass( "on" ).eq(num).addClass( "on" ); num++; } var timer = setInterval(function(){slideRun(num)}, 500); // 要给函数用闭包的形势 |
区别:
setTimeout()
从载入后延迟指定的时间去执行一个表达式或者是函数;
仅执行一次 ;和window.clearTimeout一起使用.
setInterval()
在执行时,它从载入页面后每隔指定的时间执行 一个表达式或者是函数;(功能类似于递归函数);和window.clearInterval一起使用.
补充说明:
这两个方法都可以用来实现在一个固定 时间段之后去执行JavaScript。不过两者各有各的应用场景。
方 法
实际上,setTimeout和 setInterval的语法相同。它们都有两个参数,一个是将要执行的代码字符串,还有一个是 以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码。
不过这两个函数还是有区别的, setInterval在执行完一次代码之后,经过了那个固定的时间间隔,它还会自动重复执行代 码,而setTimeout只执行一次那段代码。
虽然表面上看来setTimeout只能应用在on-off方式的动作上,不过可以通 过创建一个函数循环重复调用setTimeout,以实现重复的操作:
showTime();
function showTime()
{
var today = new Date();
alert("The time is: " + today.toString ());
setTimeout("showTime()", 5000);
}
一旦调 用了这个函数,那么就会每隔5秒钟就显示一次时间。如果使用setInterval,则相应的代 码如下所示:
setInterval ("showTime()", 5000);
function showTime()
{
var today = new Date();
alert("The time is: " + today.toString ());
}
这两种方法可能看起来非常像,而且显 示的结果也会很相似,不过两者的最大区别就是,setTimeout方法不会每隔5秒钟就执行一 次showTime函数,它是在每次调用setTimeout后过5秒钟再去执行showTime函数。这意味着 如果showTime函数的主体部分需要2秒钟执行完,那么整个函数则要每7秒钟才执行一次。 而setInterval却没有被自己所调用的函数所束缚,它只是简单地每隔一定时间就重复执行 一次那个函数。
如果要求在 每隔一个固定的时间间隔后就精确地执行某动作,那么最好使用setInterval,而如果不想 由于连续调用产生互相干扰的问题,尤其是每次函数的调用需要繁重的计算以及很长的处 理时间,那么最好使用setTimeout。
Jquery中使用定时器setInterval和setTimeout的更多相关文章
- Vue中使用定时器setInterval和setTimeout
js中定时器有两种,一个是循环执行setInterval,另一个是定时执行setTimeout 一.循环执行(setInterval) 顾名思义,循环执行就是设置一个时间间隔,每过一段时间都会执行一次 ...
- js定时器setInterval()与setTimeout()
js定时器setInterval()与setTimeout() 1.setTimeout(Expression,DelayTime),在DelayTime过后,将执行一次Expression,setT ...
- 定时器( setInterval和 setTimeout)
一.定时器setInterval-------常用的,反复循环的 <input type="button" value="停止" id="btn ...
- setInterval 和 setTimeout 定时器
前端定时器 setInterval 和 setTimeout setInterval 循环执行 循环执行就是设置一个时间间隔,每过一段时间都会执行一次这个方法,直到这个定时器被销毁掉. 用法是setI ...
- javascript中window与document对象、setInterval与setTimeout定时器的用法与区别
一.写在前面 本人前端菜鸟一枚,学习前端不久,学习过程中有很多概念.定义在使用时容易混淆,在此给向我一样刚踏入前端之门的童鞋们归纳一下.今天给大家分享一下js中window与document对象.se ...
- JS里设定延时:js中SetInterval与setTimeout用法
js中SetInterval与setTimeout用法 JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操 ...
- 关于setInterval和setTImeout中的this指向问题
前些天在练习写一个小例子的时候用到了定时器,发现在setInterval和setTimeout中传入函数时,函数中的this会指向window对象,如下例: var num = 0; function ...
- setInterval和setTImeout中的this指向问题
问题:在setInterval和setTimeout中传入函数时,函数中的this会指向window对象 解决方法: 1. 将当前对象的this存为一个变量,定时器内的函数利用闭包来访问这个变量.va ...
- vue 项目中,定时器(setInterval)的写法
vue 项目中,定时器(setInterval)的写法: fetchJobList是一个方法,里面有dispatch一个action进行请求接口的代码. data () { return { inte ...
随机推荐
- 第9月第15天 设计模式 adapter mvc
1. 有一道iOS面试题,iOS中都有什么设计模式?很少有答案说包括adapter. gof 书中adapter模式有以下内容: 实现: ... b ) 使 用 代 理 对 象 在这种方法中, T r ...
- python所有基础
下面就不一一列举了,所有的资料都和GitHub对接,到时候我有更新就直接拖到GitHub上面了.入门的小伙伴们可以进来看看,估计后面还会有很多项目,待更新.
- (A - 整数划分 HYSBZ - 1263)(数组模拟大数乘法)
题目链接:https://cn.vjudge.net/problem/HYSBZ-1263 题目大意:中文题目 具体思路:先进了能的拆成3,如果当前剩下的是4,就先不减去3,直接乘4,如果还剩2的话, ...
- 如何生成能在没有安装opencv库及vs2010环境的电脑上运行的exe文件
项目基本算法已经完成,甲方需要一个可以运行的demo.目前,程序能在自己的电脑上正常运行.移植到其他win7系统上,运行失败. 寻找各种解决办法,baidu找到两个办法: 1.使用静态链接的方法,这种 ...
- linux服务器如何添加sudo用户
1. 编辑 vi /etc/ssh/sshd_config 文件,修改默认端口:默认Port为22,并且已经注释掉了,修改是把注释去掉,并修改成其它的端口. 原来用默认端口:22修改为:8975 (这 ...
- C#, CLR, and .NET Framework versions
- ftp配置文件
vsftpd配置文件采用“#”作为注释符,以“#”开头的行和空白行在解析时将被忽略,其余的行被视为配置命令行,每个配置命令的“=”两边不要留有空格.对于每个配置命令,在配置文件中还列出了相关的配置说明 ...
- opencv 车牌字符分割 ANN网络识别字符
最近在复习OPENCV的知识,学习caffe的深度神经网络,正好想起以前做过的车牌识别项目,可以拿出来研究下 以前的环境是VS2013和OpenCV2.4.9,感觉OpenCV2.4.9是个经典版本啊 ...
- 【OpenCV for Android】Android Studio JNI和NDK配置及采坑记录
在配置好Android studio的OpenCV环境后,我们就可以通过Java代码调用OpenCV的API了,但是在通常情况下,用Java代码编写图像处理算法的运行效率是没有C++代码高的,在应用层 ...
- v-if案例解析(element-ui form-item 结合 v-if 动态生成rule规则\表单元素,表单无法验证问题剖析 )
fire 读在最前面: 1.此文章衔接Vue 虚拟Dom 及 部分生命周期初探,相关整体知识点请先阅读后再继续本文阅读 问:当v-if为true时,会重新渲染相关dom节点吗? <child v ...