JS中定时器的返回数值ID值
定时器会返回一个数字值id，可以由clearInterval(id)或clearTimeout(id)来实现对对应定时器的清除。
setInterval()/setTimeout()BOM中的Window对象方法，以返回数字值id来清除定时器的排序位置存在一定的兼容性问题。通常采用一个变量接受定时器产生的返回值id，通过变量来这种方式来实现关闭定时器操作的兼容性。
chorme浏览器测试：
var i = 0;
var timer = setInterval(function () {
console.log(i + 'i');
i++;
}, 1000)
console.log(timer);//=>1，firefox浏览器可能显示为2，这是BOM中的兼容性问题
console.log(typeof timer);//=>'number'
直接采用定时器返回的数值ID关闭定时器的代码：（chrome[版本 73.0.3683.103(正式版本)(64 位)]测试有效）
var j=0;
var a = setInterval(function () {
console.log(j + 'j');
j++;
}, 1000);
clearInterval(1);
一般避免BOM中定时器返回数值ID直接使用，以免产生兼容性问题。避免这种兼容性使用定时器的案例：
<!DOCTYPE html>
<html lang="zh-CN"> <head>
<meta charset="UTF-8">
<title>cnblog头部轮播图</title>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<style>
</style>
<script> </script>
</head>
<body>
<input type='button' value='点击开启定时器' id='btn' />
<input type='button' value='点击关闭定时器' id='btn-close' />
<p id='content'></p>
<script>
var i = 0;
var oBtn = document.getElementById('btn');
var oBtnC = document.getElementById('btn-close');
var oP = document.getElementById('content');
var timer = null;
oBtn.onclick = function () {
if(timer){
clearInterval(timer);
}
timer=setInterval(function () {
oP.innerHTML += i + '<br/>';
i++;
}, 1000);
}
oBtnC.onclick = function (){
clearInterval(timer); }
</script>
</body> </html>
测试时，以下版本浏览器的定时器返回数值ID以1为起始，一次后排。
Chrome[版本 73.0.3683.103(正式版本)(64 位)]
UC[版本6.2.4098.3]
Edge[Microsoft Edge 44.17763.1.0]测试。
但是兼容性问题浏览器：
fireFox[版本67.0.3 (32 位)]要在原定时器的序位的基础上加1。
JS中定时器的返回数值ID值的更多相关文章
- 关于js中定时器的返回值问题
在js中,我们常常会用到定时器来处理各种各样的问题,当我们需要清除定时器的时候,我们常常会定义一个值来接受定时器的返回值,然后再把定义好的这个值写到清除定时器的括弧后面,如: var times = ...
- js中定时器相关
每三秒(3000 毫秒)弹出 "Hello" : setInterval(function(){ alert("Hello"); }, 3000); setIn ...
- JS中给函数参数添加默认值（多看课程）
JS中给函数参数添加默认值(多看课程) 一.总结 一句话总结:咋函数里面是可以很方便的获取调用函数的参数的,做个判断就好,应该有简便方法,看课程. 二.JS中给函数参数添加默认值 最近在Codewar ...
- SpringMVC中通过@ResponseBody返回对象，Js中调用@ResponseBody返回值，统计剩余评论字数的js，@RequestParam默认值，@PathVariable的用法
1.SpringMVC中通过@ResponseBody.@RequestParam默认值,@PathVariable的用法 package com.kuman.cartoon.controller.f ...
- js中多个数字运算后值不对（失真）处理方法
最近遇到一个bug ,在js里面计算两个数字相减,633011.20-31296.30 得到的结果居然是601714.89,领导不乐意了说怎么少了0.01,我一听,噶卵达,来达鬼,不可能啊,我Goog ...
- JS中给函数参数添加默认值
最近在Codewars上面看到一道很好的题目,要求用JS写一个函数defaultArguments,用来给指定的函数的某些参数添加默认值.举例来说就是: // foo函数有一个参数,名为x var f ...
- js中的referrer返回上一页使用介绍
js中的referrer的用法举例. js完整代码: <script language="javascript"> var refer=document.refer ...
- js中定时器
周期性定时器:周期性的执行某段代码 window.setInterval() window.clearInterval() 示例: document.it = setInterval(fun ...
- js中定时器调用函数时为什么会有引号
之前在学习的时候并没有发现的细节,关于js中,定时器的问题 这里我们写两个延时器 setTimeout(func, 0); setTimeout("func()", 0);定时器中 ...
随机推荐
- php实现文件的下载
<?php$file_name="test.mp4";//需要下载的文件$fp=fopen($file_name,"r+");//下载文件必须先要将文件打 ...
- 全文搜索（A-4）-推荐系统架构
推荐系统向用户推荐物品有三种情况. 推荐和用户已表示喜欢的物品相似的物品. 推荐和用户有相似偏好的用户喜欢的物品. 推荐包含用户偏好特征的物品.
- [luoguP1489] 猫狗大战（DP）
传送门 类似背包的做法. f[i][j]表示是否能放i个物品,价格为j #include <cstdio> #include <iostream> #define N 8001 ...
- 关于java对于大数处理的相关程序和用法
<span style="font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 13px; l ...
- Flask组件：flask-sqlalchemy & flask-script & flask-migrate
flask-sqlalchemy组件 项目目录结构: flask目录 # 项目名 |--- flaskdir |--- static # 静态文件 |--- templates # 模板 |--- m ...
- nyoj_10_skiing_201405181748
skiing 时间限制:3000 ms | 内存限制:65535 KB 难度:5 描述 Michael喜欢滑雪百这并不奇怪, 因为滑雪的确很刺激.可是为了获得速度,滑的区域必须向下倾斜,而且当 ...
- sqlserver2008 存储过程使用表参数
----首先,我们定义一个表值参数类型,其实就是一个表变量 Create type dbo.tp_Demo_MultiRowsInsert as Table ( [PName] [Nvar ...
- crontab not running
there are mutliple ways to describle this issue 1. crontab not running 2. crontab not running and no ...
- Mybatis中insert中返回主键ID的方法
<insertid=“doSomething"parameterType="map"useGeneratedKeys="true"keyProp ...
- 大话设计模式C++实现-第8章-工厂方法模式
一.UML图 二.概念 工厂方法模式(Factory Method):定义一个用于创建对象的接口,让子类决定实例化哪一个类.工厂方法是一个类的实例化延迟到其子类. 三.包括的角色 (1)抽象工厂 (2 ...