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时该“参数”值一样.是不是有点懵?看如下例子: ================ ...
随机推荐
- 排序算法 ----(转载::http://blog.csdn.net/hguisu/article/details/7776068)
1.插入排序—直接插入排序(Straight Insertion Sort) 基本思想: 将一个记录插入到已排序好的有序表中,从而得到一个新,记录数增1的有序表.即:先将序列的第1个记录看成是一个有序 ...
- 查询目前运行状态-CPU等情况
对目前的数据库的运行状况有一个基本的了解 ) DB_NAME(a.dbid) AS dbname , loginame , spid , cpu , b.text , lastwaittype , w ...
- ASP.NET使用ConfigurationSection在Web.Config创建自定义配置节
主要代码,一定要继续System.Configuration.ConfigurationSection,具体的节点名称可以自行修改 using System; using System.Data; u ...
- 使用PouchDB来实现React离线应用
最近听到有同学在讨论关于数据上传遇到离线的问题,因此在这里介绍一下PouchDB. PouchDB 是一个开源的javascript数据库,他的设计借鉴于Apache CouchDB,我们可以使用他来 ...
- PowerPoint
工具/原料 PowerPoint 2007 百度经验:jingyan.baidu.com 一.PowerPoint2007基础知识 1 桌面快捷方式:也可以“开始”菜单→程序→Microsoft Of ...
- 杨光福IT讲师微博
杨光福IT讲师微博: http://weibo.com/321chinavideo 微博现在里面有很多干货,以后会越来越多,主要用于分享和交流技术.关注一下对你有帮助.
- spark学习笔记总结-spark入门资料精化
Spark学习笔记 Spark简介 spark 可以很容易和yarn结合,直接调用HDFS.Hbase上面的数据,和hadoop结合.配置很容易. spark发展迅猛,框架比hadoop更加灵活实用. ...
- Software Testing hw3
(a):可绘制出如下图所示的流程图 (b):对于测试用例t1=(n=3)和t2=(n=5),MAXPRIMES = 4时,t1不能检查出错误,而t2则会发生数组越界错. (c):要使测试路径不通过wh ...
- C++是一把很奇怪的刀
C++是一把很奇怪的刀,首尾都是刀刃.用刀能出什么,还是要看拿刀的人.
- Strong name signature not valid for this assembly Microsoft.mshtml.dll
Strong name signature not valid for this assembly Microsoft.mshtml.dll http://social.msdn.microsoft ...