文章目录

js settimeout()用法详解,说一千道一万不如实例实在

javascript的setTimeout()方法,在编程中可谓是经常要用到的。

那么它究竟有什么作用呢?

官方是这样说的,setTimeout()用于在指定的毫秒数后调用函数或是表达式。

说一千道一万,不如来一些实例更实在。

实例1,在2秒后隐藏。

html代码<div id="divbox" style="width:100px;height:100px; line-height:30px;display:inline-block; border:1px #333 solid; text-align:center;">
要调用的函数后要执行的 JavaScript 代码串。
</div>
<p><input type="button" id="btn" value="点我1秒后隐藏上面的div" /></p>
<script>
$("#btn").click(function(){
    setTimeout("hideDiv()",1000);
});
function hideDiv(){
    $("#divbox").hide("slow");
};
</script>

亲自测试一下

上面的实例是,点击按钮1秒后调用函数。需要注意的是,调用的函数要放到眼号里面。

实例2,直接执行表达式。

html代码<p id="pbox">
请等待3秒,此处将会消失。
</p>
<script>
setTimeout('$("#pbox").hide("slow")',3000)
</script>

亲自测试一下

以上实例,是当打开网页后,等待3秒,pbox会自动消失。

实例3,每隔一秒数值加1。

html代码<form name="form1">
<input type="text" name="numbox" value="0" size="4" />
</form>
<script>
i=0;
function countNum(){
    i=i+1;
    document.form1.numbox.value=i;
    setTimeout("countNum()",1000);
}
countNum();
</script>

亲自测试一下

当然,你也可以设置其他的递增速度,其实就是在循环的执行。

用这个方法可以指定网页每隔多久执行相关的程序。

setTimeout()方法的用处还有很多很多,这里只是冰山一角,希望小伙伴们自己摸索,达到自己想要的效果。

本文网址:http://www.santii.com/article/46.html


数据更新时间:2018-10-16