之前用过定时器,只不过用的不是很多,关于js定时器,一般而言我们很容易想到setInterval和setTimeout这两种。

  刚开始学js定时器时,记住了setInterval,该方法一般用于每隔多久就调用定时器中的方法一次,是可以循环执行的,而setTimeout则是过多久后才执行定时器中的方法,只执行一次。所以我就想当然的以为如果要循环调用某方法,就得使用setInterval,如果是只调用某方法一次,就使用setTimeout,却发现原来我错了,其实,setTimeout也可以循环执行某一方法。但是必须将该定时器放在一个函数中,在外面调用这个函数,这样,函数里的定时器就可以循环执行了。

  例如,我要实现点击一个按钮,然后旁边的输入框中的值实现累加效果。如图:

  

  这里直接上代码:

<input type="button" value="按钮" onclick="getVal()"><input type="text" id="num" value="0">
<script>
function getVal(){
var val = document.getElementById('num').value; // 获取输入框中的值
val++;
document.getElementById('num').value = val;
setTimeout(getVal,1000) // 一秒后调用getVal方法
}
</script>

  这里是将定时器放在函数中,然后通过点击按钮来调用该函数,从而实现定时器循环执行。

js定时器之setTimeout的使用的更多相关文章

  1. JS定时刷新页面及跳转页面

    JS定时刷新页面及跳转页面 Javascript 返回上一页1. Javascript 返回上一页 history.go(-1), 返回两个页面: history.go(-2); 2. history ...

  2. asp.net类似于js中的setTimeOut()的函数作用?

    asp.net类似于js中的setTimeOut()的函数作用? 插入这行即可,定时2秒,再运行下一步: System.Threading.Thread.Sleep(); 加个随机数 Random r ...

  3. js里的setTimeout和setInterval之后的页面是空白,阻塞浏览器的document对象,但是不阻塞script方法

    js里的setTimeout和setInterval是否进程阻塞? 阻塞浏览器的document对象,但是不阻塞script方法 当你在setTimeout中使用document.write时是不行的 ...

  4. ExtJS定时和JS定时

    ExtJS定时 //定时刷新待办事宜状态 var task={ run:function(){ //执行的方法或方法体 }, interval:5*60*1000 //5分钟 } //定时启动 Ext ...

  5. Js setInterval与setTimeout(定时执行与循环执行)的代码(可以传入参数)

    最近在做项目时用到了定时执行的js方法,setInterval与setTimeout时间长了不用有些生疏了,所以自己总结了一下,记下来,以便以后使用. Document自带的方法: 循环执行:var ...

  6. javascript中的两个定时函数setTimeOut()和setInterVal()的区别

    js中经常性要用到间隔几秒或暂停几秒执行某个函数, 简单介绍我从网上收集到setTimeOut()和setInterVal()的区别1.setInterVal()介绍 1)定义 setInterval ...

  7. 关于js中的setTimeout和setInterval

    http://ejohn.org/blog/how-javascript-timers-work 这是John的一篇博文说到setTimeout和setInterval的区别,在看js高效图形编程的时 ...

  8. js定时跳转

    在项目中有时会用到定时跳转,自己收藏了一个比较好用的 js写的,不依赖jQuery <script type="text/javascript"> function c ...

  9. JavaScript定时机制setTimeout与setInterval研究

    JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不少人都深有同感, 例如 setTimeout( ...

随机推荐

  1. 朴素的treap

    所谓Treap,就是一种二叉查找树,而我们知道二叉查找树,相对来说比较容易形成最坏的链表情况,所以我们有一种数据结构来防止二叉查找树出现最坏情况,那就是Treap. Treap=tree+heap,T ...

  2. python导入模块时的执行顺序

    当python导入模块,执行import语句时,到底进行了什么操作?按照python的文档,她执行了如下的操作: 第一步,创建一个新的module对象(它可能包含多个module) 第二步,把这个mo ...

  3. 配置apache的文件访问路径

    本例中,我们让apache访问"F:/testObject/php"路径: 一.修改http.conf文件配置 访问路径:"apache/conf/httpd.conf& ...

  4. linux设置静态IP和DNS以及改网卡名

    ubuntu Ubuntu如果是desktop版,由于desktop版安装了NetworkManager,修改完interfaces文档中的内容,不会生效,需要先修改/etc/NetworkManag ...

  5. python之 模块与包

    一. 模块 1.模块定义: 将代码量较大的程序分割成多个有组织的.彼此独立但又能互相交互的代码片段,这些自我包含的有组织的代码段就是模块. 2.模块分类: a.标准库(又称内置模块) b.开源模块(又 ...

  6. JavaScript(一)js简单介绍

    JavaScript JS历史简述: javascript 是 netscape 网景公司 的  布兰德·艾奇  研发的, 网景要求  布兰德·艾奇 10天开发出来一个与Java相似 但要比java简 ...

  7. Mycat 配置

    前言 Mycat 是一个数据库分库分表中间件 MyCAT 是作为通用代理设计的,后端是以 Mysql协议 和 JDBC 的方式连接数据库,可以支持 Oracle.DB2.SQL Server . mo ...

  8. Percona XtraBackup的部分备份与恢复/单库备份/单表备份/指定库备份/指定表备份

    本文是翻译的Percona XtraBackup 2.2版的官方文档,原文地址在此:https://www.percona.com/doc/percona-xtrabackup/2.2/innobac ...

  9. ConcurrentHashMap源码阅读

    1. 前言 HashMap是非线程安全的,在多线程访问时没有同步机制,并发场景下put操作可能导致同一数组下的链表形成闭环,get时候出现死循环,导致CPU利用率接近100%. HashTable是线 ...

  10. zookeeper leader选举算法源码

    服务器状态 在QuorumPeer中有定义,这个类是一个线程. LOOKING:寻找Leader状态.处于该状态时,它会认为当前集群中没有Leader,进入选举流程. FOLLOWING: LEADI ...