定时器会返回一个数字值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值的更多相关文章

  1. 关于js中定时器的返回值问题

    在js中,我们常常会用到定时器来处理各种各样的问题,当我们需要清除定时器的时候,我们常常会定义一个值来接受定时器的返回值,然后再把定义好的这个值写到清除定时器的括弧后面,如: var times = ...

  2. js中定时器相关

    每三秒(3000 毫秒)弹出 "Hello" : setInterval(function(){ alert("Hello"); }, 3000); setIn ...

  3. JS中给函数参数添加默认值（多看课程）

    JS中给函数参数添加默认值(多看课程) 一.总结 一句话总结:咋函数里面是可以很方便的获取调用函数的参数的,做个判断就好,应该有简便方法,看课程. 二.JS中给函数参数添加默认值 最近在Codewar ...

  4. SpringMVC中通过@ResponseBody返回对象，Js中调用@ResponseBody返回值，统计剩余评论字数的js，@RequestParam默认值，@PathVariable的用法

    1.SpringMVC中通过@ResponseBody.@RequestParam默认值,@PathVariable的用法 package com.kuman.cartoon.controller.f ...

  5. js中多个数字运算后值不对（失真）处理方法

    最近遇到一个bug ,在js里面计算两个数字相减,633011.20-31296.30 得到的结果居然是601714.89,领导不乐意了说怎么少了0.01,我一听,噶卵达,来达鬼,不可能啊,我Goog ...

  6. JS中给函数参数添加默认值

    最近在Codewars上面看到一道很好的题目,要求用JS写一个函数defaultArguments,用来给指定的函数的某些参数添加默认值.举例来说就是: // foo函数有一个参数,名为x var f ...

  7. js中的referrer返回上一页使用介绍

    js中的referrer的用法举例. js完整代码:  <script language="javascript">  var refer=document.refer ...

  8. js中定时器

    周期性定时器:周期性的执行某段代码 window.setInterval()      window.clearInterval() 示例: document.it = setInterval(fun ...

  9. js中定时器调用函数时为什么会有引号

    之前在学习的时候并没有发现的细节,关于js中,定时器的问题 这里我们写两个延时器 setTimeout(func, 0); setTimeout("func()", 0);定时器中 ...

随机推荐

  1. Qt笔记——连接第三方库&用libZPlay库获取音频文件的艺术家、专辑等信息

    连接第三方库libZPlay 概述 需要.a/.lib ,.h , .dll 三个文件 官网下载 http://libzplay.sourceforge.net/ import .h 链接 .a 放入 ...

  2. 上传文件表单file，限制上传文件类型的方法--参数accept

    我们使用<input type="file" />来上传文件,但是当你只想要上传某种格式的文件,比如说(jpg)文件时.可以通过accept来限制. <form& ...

  3. poj - 3041 Asteroids (二分图最大匹配+匈牙利算法)

    http://poj.org/problem?id=3041 在n*n的网格中有K颗小行星,小行星i的位置是(Ri,Ci),现在有一个强有力的武器能够用一发光速将一整行或一整列的小行星轰为灰烬,想要利 ...

  4. UVA 116_ Unidirectional TSP

    题意: 给定整数矩阵,从第一列的任何一个位置出发,每次可以向右.右上.右下走一个格,将最后一行和第一行看成是邻接的,最终到达最后一列,路径长度为所经过格中的整数之和,求最小路径,答案不唯一,输出字典序 ...

  5. CODEVS——T 3736 【HR】万花丛中2

    http://codevs.cn/problem/3736/  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解       题目描述 Description ...

  6. Ubuntu 16.04 GNOME添加桌面图标/在桌面上显示图标

    GNOME默认不能在桌面上创建文件夹,但是可以通过工具设置:用gnome-tweak-tool设置Nautilus接管桌面即可. 安装: sudo apt-get install gnome-twea ...

  7. Spring Boot中微信全局token的缓存实现

    为什么要缓存token? 这里的token指的是微信JSAPI中基础支持的ACCESS_TOKEN,并非网页授权ACCESS_TOKEN.网页授权Token每天的调用次数没有限制,不需要缓存. 接口 ...

  8. NA路由②

     CISCO常见的命令语法:     R(c)#ip route network {mask} address/interface :                     参数   {}可选项   ...

  9. Cocos2dx 小技巧（九）现成的粒子特效

    和高中的她 差点儿相同有两三年没见面了吧.下午她正好来泉州.我俩出来一起吃了个饭. 怎么说呢,自从高中毕业后我俩的联系就少了非常多.大学期间也就见过两三面吧. 现在毕业也快一年了,她已是人妇,而我自己 ...

  10. C#如何让Listbox支持多选

    把SelectionMode改成MultiExtended