js中setTimeout()的使用bug
今天用setTimeout()时,遇到一个奇怪的现象,通过多方面的查询,最终解决了问题,这是setTimeout()设计的时候存在的一点点bug。
代码的作用主要是在三秒后自动关闭本浏览器窗口:
代码如下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Test</title> <style> body{ background: RGBA(38,38,38,1); color:red; font-family: 楷体; font-weight: bold; font-size: 35px; } </style> <script> var i = 4; var oP=null; window.onload = function() { oP = document.getElementById('p'); clock(); } function clock() { i = i - 1; if (i > 0) { oP.innerHTML = "窗口将在" + i + "秒后自动关闭!"; setTimeout(clock, 1000); } else { closewin(); } } function closewin() { self.opener = null; self.close(); } </script> </head> <body> <p>正在退出系统......</p> <p id="p"></p> </body> </html>
运行结果:结果正常,数字可以从3变到1
修改代码:修改后,代码运行,数字停留在3后不会动,主要调整是把clock()和closewin()放在了window.onload()里面。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Test</title> <style> body{ background: RGBA(38,38,38,1); color:red; font-family: 楷体; font-weight: bold; font-size: 35px; } </style> <script> var i = 4; var oP=null; window.onload = function() { oP = document.getElementById('p'); clock(); function clock() { i = i - 1; if (i > 0) { oP.innerHTML = "窗口将在" + i + "秒后自动关闭!"; setTimeout("clock()", 1000); } else { closewin(); } } function closewin() { self.opener = null; self.close(); } } </script> </head> <body> <p>正在退出系统......</p> <p id="p"></p> </body> </html>
然后我把setTimeout()改为用setInterval()函数后,上面两个代码都可以解决,在这段代码里,setTimeout()和setInterval()都是起到同样的作用,那就是递归。
为什么会出现这样的情况?
看下面我修改后的代码,仅仅动了一行代码,就是下面标红的地方,仅仅把引号和括号去了:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Test</title> <style> body{ background: RGBA(38,38,38,1); color:red; font-family: 楷体; font-weight: bold; font-size: 35px; } </style> <script> var i = 4; var oP=null; window.onload = function() { oP = document.getElementById('p'); clock(); function clock() { i = i - 1; if (i > 0) { oP.innerHTML = "窗口将在" + i + "秒后自动关闭!"; setTimeout(clock, ); } else { closewin(); } } function closewin() { self.opener = null; self.close(); } } </script> </head> <body> <p>正在退出系统......</p> <p id="p"></p> </body> </html>
此时,数字又可以动,一切都正常了。
总结:
setTimeout()在使用的时候虽然可以用setTimeout("方法名()",毫秒数);
但是不要用,因为在内部使用的的时候会出现找不到这个函数的问题,在谷歌浏览器中按F12可以看到,建议一直使用和setInterval()一样的,直接使用方法名字即可,由于js的语法不规范,有时候各种不规范都可以运行,有时候难免会出现错误。
js中setTimeout()的使用bug的更多相关文章
- js中settimeout方法加参数
js中settimeout方法加参数的使用. 简单使用看w3school 里面没有参数调用, 例子: <script type="text/javascript"> ...
- js中setTimeout/setInterval定时器用法示例
js中setTimeout(定时执行一次)和setInterval(间隔循环执行)用法介绍. setTimeout:在指定的毫秒数后调用指定的代码段或函数:setTimeout示例代码 functio ...
- 【转】JS中setTimeout和setInterval的最大延时值详解
前言 JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成.而这篇文中主要给大家介绍的是关于JS中setTi ...
- Node.js中setTimeout和setInterval的使用
Node.js和js一样也有计时器,超时计时器.间隔计时器.及时计时器,它们以及process.nextTick(callback)函数来实现事件调度.今天先学下setTimeout和setInter ...
- js 中 setTimeout()的用法
setTimeout()在js类中的使用方法 setTimeout (表达式,延时时间)setTimeout(表达式,交互时间)延时时间/交互时间是以豪秒为单位的(1000ms=1s) setTi ...
- js中setTimeout()的使用
setTimeout()在js类中的使用方法 setTimeout (表达式,延时时间)setTimeout(表达式,交互时间)延时时间/交互时间是以豪秒为单位的(1000ms=1s) setTi ...
- js中setTimeout和setInterval的应用方法(转)
JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操作. setTimeout("function& ...
- js中setTimeout()时间参数设置为0的探讨
起因源于一道前端笔试题: var fuc = [1,2,3]; for(var i in fuc){ setTimeout(function(){console.log(fuc[i])},0); co ...
- 兼容性js中setTimeout 传参“保值”方案
这里所谓“保值”,是指在setTimeout中指定的时间后,执行指定的方法所用到的“参数”值,跟执行setTimeout时该“参数”值一样.是不是有点懵?看如下例子: ================ ...
随机推荐
- k次出现与一次出现的数字
原始的题目是这样的: Single Number II Given an array of integers, every element appears three times except for ...
- js-正则表达式的替换
正则表达式替换使用的是replace()方法.Replace()方法是用一些字符途欢另一些字符 语法:stringObject.replace(regexp,replacement) regexp 必 ...
- js跳转到新页面传参以及接收参数的方法
1.传递参数: window.location.href = "./list.html?id="+id; 1.接收参数: (1)接收参数函数封装 function GetReque ...
- 小JAVA大世界之万年历
import java.util.Scanner; public class Calendar { public static void main(String[] args) { // 万年历 in ...
- spring事务源码研读1
转载摘录自:Spring事务源码分析(一)Spring事务入门 有时为了保证一些操作要么都成功,要么都失败,这就需要事务来保证. 传统的jdbc事务如下: @Test public void test ...
- Rational.Rose.Enterprise.v7.0 (2007)安装分享
很多人都在找rational软件,很多都是2003的,有的宣称是2007,但结果还是2003.也许真的不存在Rational.Rose 2007,不过有IBM.Rational.Rose.Enterp ...
- CodeForces 743C Vladik and fractions (数论)
题意:给定n,求三个不同的数满足,2/n = 1/x + 1/y + 1/z. 析:首先1是没有解的,然后其他解都可以这样来表示 1/n, 1/(n+1), 1/(n*(n+1)),这三个解. 代码如 ...
- C++builder中使用TScrollBox 以后,让scrollBox相应鼠标的上下滑动
1.在窗口的事件里搜索 mouseWheel的方法 2.在.cpp文件里实现下面的代码 void __fastcall TForm1::mouseWheel(TObject *Sender, TShi ...
- linux下rm -r误删NTFS文件恢复方法
一时疏忽,手一抖,把整个挂载的F盘删了一半!顿时傻眼!! 被删的F盘是Windows下NTFS分区,在Ubuntu12.04中挂载了F盘,使用rm命令时粗心大意,误删了一半的数据. 血的教训告诉我们, ...
- java 堆栈的区别(转百度)
转:http://zhidao.baidu.com/link?url=Y1XnuCnTiw6BsUoW85MWSx_x7k0QAS39kz4dTy9ngkMkZjvlSEHVfdflOGVWs6TcH ...