龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > Javascript编程 >

javascript setTimeout() 倒计时实现代码

时间:2012-12-29 08:41来源:未知 作者:admin 点击:
分享到:
文章介绍了利用javascript setTimeout()来做 倒计时功能,这个方法非常不错,同时也介绍了setInterval函数的用法。有需要的朋友参考一下。 div距离页面关闭还有 span id=limit5/span 秒/div 代码如下
文章介绍了利用javascript setTimeout()来做 倒计时功能,这个方法非常不错,同时也介绍了setInterval函数的用法。有需要的朋友参考一下。


<div>距离页面关闭还有 <span id="limit">5</span> 秒</div>

 代码如下
<script type="text/javascript">
<!--
function showlimit(){
    for(var i=5;i>=0;i--){
        setTimeout("setlimit("+i+")",i*1000);
    }
}
 
function setlimit(i){
    var n = -(i-5);
    var obj = document.getElementById("limit");
    if(obj){
        obj.innerHTML = n;
    }
}
window.onload = function(){
    showlimit();
}
//-->
</script>

应用于窗口关闭提示,页面关闭提示等,注意javascript的负负得正这个算法。

看实例一个迟延加载代码

 代码如下

<script type="text/javascript">
function timedText()
{
var t1=setTimeout("document.getElementById('txt').value='2 seconds!'",2000)
var t2=setTimeout("document.getElementById('txt').value='4 seconds!'",4000)
var t3=setTimeout("document.getElementById('txt').value='6 seconds!'",6000)
}
</script>

这是一段js代码就是过2,4,6秒执行一次。

在form里面如下。

 代码如下

<input type="button" value="显示计时的文本!" onClick="timedText()">
<input type="text" id="txt">

这样我们只要输入一个字符开始就会看到2,4,6显示了哦。

更多详细内容请查看:http://www.111cn.net/wy/99/e80915fb120d9b233c8471240a7390aa.htm


setTimeout实现的自动变化显示随机数的效果:

 代码如下
<html>
<head>
<script>
window.onload=sett;
function sett()
{
document.body.innerHTML=Math.random();
setTimeout("sett()",500);
}
</script>
</head>
<body>
</body>
</html>

 

相关函数:

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。

setTimeout() 只执行 code 一次。如果要多次调用,请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。

用setInterval实现的自动变化显示随机数的效果:

 代码如下

<html>
<head>
<script>
function sett()
{
document.body.innerHTML=Math.random();
}
setInterval("sett();", 500);
</script>
</script>
</head>
<body>
</body>
</html>


精彩图集

赞助商链接