js定时器出现第一次延迟的原因及解决方法


Posted in Javascript onJanuary 04, 2021

我们在使用js定时器,经常会出现间隔几秒获取一次数据,这是通过setInterval实现的。而且如果setInterval() 参数传递不当,定时器会延迟试行。本文向大家介绍js定时器第一次延迟的原理及实现过程。

setInterval()

作用是在播放动画的时,每隔一定时间就调用函数、方法或对象。

语法

setInterval(function(),time); 单位是毫秒

注意:单位是毫秒

定时器第一次延迟执行:采用setInterval实现

var t = setInterval(scrollTop,2500);
function scrollTop(){
 // ...
}

js setInterval第一次执行时存在延迟的解决方法

在使用setInterbal(function,delayTime)方法时,发现它会为函数的第一次调用也做延迟。一般我们都是第一次立即调用,然后延迟调用。我的解决方法如下:

需要延迟调用的函数:
  function callinSound(){
  	var callin=$('#callin')[0];
  	callin.load();
  	callin.play();
  	//第一次执行完成后返回这个函数
  	return callinSound;
  }
调用方:setInterval(callinSound(),6000);
首先,调用callinSound()方法,然后延迟执行。

到此这篇关于js定时器出现第一次延迟的原因及解决方法的文章就介绍到这了,更多相关js定时器为什么会出现第一次延迟内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
JS的encodeURI和java的URLDecoder.decode使用介绍
May 08 Javascript
PHP+mysql+Highcharts生成饼状图
May 04 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
Oct 14 Javascript
jQuery实现选项联动轮播效果【附实例】
Apr 19 Javascript
jQuery获取select选中的option的value值实现方法
Aug 29 Javascript
基于JQuery及AJAX实现名人名言随机生成器
Feb 10 Javascript
js实现多张图片延迟加载效果
Jul 17 Javascript
vue引入js数字小键盘的实现代码
May 14 Javascript
更强大的vue ssr实现预取数据的方式
Jul 19 Javascript
js 实现watch监听数据变化的代码
Oct 13 Javascript
vue-cropper组件实现图片切割上传
May 27 Vue.js
JS实现简单九宫格抽奖
Jun 28 Javascript
JavaScript实现页面高亮操作提示和蒙板
Jan 04 #Javascript
js正则表达式简单校验方法
Jan 03 #Javascript
vue+vant 上传图片需要注意的地方
Jan 03 #Vue.js
vue调用微信JSDK 扫一扫,相册等需要注意的事项
Jan 03 #Vue.js
vue中使用echarts的示例
Jan 03 #Vue.js
vue 动态生成拓扑图的示例
Jan 03 #Vue.js
Vue中强制组件重新渲染的正确方法
Jan 03 #Vue.js
You might like
PHP实现下载断点续传的方法
2014/11/12 PHP
通过javascript获取iframe里的值示例代码
2013/06/24 Javascript
window.open打开页面居中显示的示例代码
2013/12/27 Javascript
jQuery实现不断闪烁文字的方法
2015/05/15 Javascript
举例说明如何为JavaScript的方法参数设置默认值
2015/11/17 Javascript
AngularJS中如何使用echart插件示例详解
2016/10/26 Javascript
JavaScript中setTimeout的那些事儿
2016/11/14 Javascript
Vue Transition实现类原生组件跳转过渡动画的示例
2017/08/19 Javascript
JavaScript new对象的四个过程实例浅析
2018/07/31 Javascript
JS实现的贪吃蛇游戏案例详解
2019/05/01 Javascript
微信小程序图表插件wx-charts用法实例详解
2019/05/20 Javascript
让IDE识别webpack的别名alias的实现方法
2020/05/06 Javascript
解决在Vue中使用axios POST请求变成OPTIONS的问题
2020/08/14 Javascript
vue 单页应用和多页应用的优劣
2020/10/22 Javascript
jQuery实现全选按钮
2021/01/01 jQuery
详解template标签用法(含vue中的用法总结)
2021/01/12 Vue.js
详解设计模式中的工厂方法模式在Python程序中的运用
2016/03/02 Python
pandas将DataFrame的列变成行索引的方法
2018/04/10 Python
Python实现计算圆周率π的值到任意位的方法示例
2018/05/08 Python
tesserocr与pytesseract模块的使用方法解析
2019/08/30 Python
flask框架url与重定向操作实例详解
2020/01/25 Python
Python并发concurrent.futures和asyncio实例
2020/05/04 Python
Python3+Django get/post请求实现教程详解
2021/02/16 Python
基础的CSS3弹性盒Flexbox布局使用实例
2016/04/08 HTML / CSS
电子信息科学专业自荐信
2014/01/30 职场文书
大一新生学期自我评价
2014/04/09 职场文书
三好学生演讲稿范文
2014/04/26 职场文书
一帮一活动总结
2014/05/08 职场文书
化学教育专业求职信
2014/07/08 职场文书
学校节能宣传周活动总结
2014/07/09 职场文书
升学宴演讲稿
2014/09/01 职场文书
党性观念心得体会
2014/09/03 职场文书
检讨书范文2000字
2015/01/28 职场文书
复试通知单模板
2015/04/24 职场文书
2015年中学团委工作总结
2015/07/22 职场文书
在Windows下安装配置CPU版的PyTorch的方法
2021/04/02 Python