如下：

<html>

<body>

        <input type="button" value="click" id="click" onclick="foo(this, 10000);"/>

</body>

<script>

function foo(obj, time) {

    obj.disabled = true;

    setTimeout(function() {

        var x = setInterval(function(){

                time= time - 1000; //reduce each second

                obj.value = (time/1000)%60;

                if(time==0){

                        clearInterval(x);

                        obj.value = "retry";

                        obj.disabled = false;

                }

        }, 1000);

    }, time-10000);

}

</script>

</html>

参考：

html button 点击 显示倒计时秒数的更多相关文章

  1. 微信小程序中利用时间选择器和js无计算实现定时器（将字符串或秒数转换成倒计时）

    转载注明出处 改成了一个单独的js文件,并修改代码增加了通用性,点击这里查看 今天写小程序,有一个需求就是用户选择时间,然后我这边就要开始倒计时. 因为小程序的限制,所以直接选用时间选择器作为选择定时 ...

  2. JavaScript--将秒数换算成时分秒

    getTime()  返回距 1970 年 1 月 1 日之间的毫秒数 new Date(dateString) 定义 Date 对象的一种方式 <!DOCTYPE html> <h ...

  3. 在Vue中使用CodeMirror 格式显示错误 行数错乱 & 代码隐藏

    项目需要在线展示和编辑Json文件,所以需要找一个代码编辑器,因为我们的项目直接使用的 vueAdmin-template 这个模板 json编辑器也是直接从 vue-element-admin 项目 ...

  4. PHP函数gmstrftime()将秒数转换成天时分秒

    http://yangjunwei.com/a/930.html PHP函数gmstrftime()将秒数转换成天时分秒   一个应用场景需要用到倒计时的时分秒,比如新浪微博授权有效期剩余: 7天16 ...

  5. ASP.NET div信息提示框显示几秒后隐藏

    今天在旧系统中,用户要求,要把一个javascript alert的信息提示,改为Div tag来显示,它在显示时,仅显示几秒,然后隐藏,这样无需用户去点击alert信息框的确定或是关闭铵钮. 下面I ...

  6. .net学习之母版页执行顺序、jsonp跨域请求原理、IsPostBack原理、服务器端控件按钮Button点击时的过程、缓存、IHttpModule 过滤器

    1.WebForm使用母版页后执行的顺序是先执行子页面中的Page_Load,再执行母版页中的Page_Load,请求是先生成母版页的控件树,然后将子页面生成的控件树填充到母版页中,最后输出 2.We ...

  7. eclipse怎么显示代码行数

    熟悉java开发的朋友们肯定有这样的经验,那就是在用eclipse进行java开发的时候,没有显示代码的行数,这并不利于我们进行程序的调试.今天,小编就来教大家eclipse怎么显示代码行数     ...

  8. *ecshop 首页促销价显示倒计时

    1.打开includes/lib_goods.php 找到 get_promote_goods()函数部 在(注意:位置别找错了,大概在394行位置) $goods[$idx]['url'] = bu ...

  9. 自学Android的第一个小程序（小布局、button点击事件、toast弹出）

    因为上班,学习时间有限,昨晚才根据教程写了一个小程序,今天忙里偷闲写一下如何实现的,来加深一下印象. 首先创建一个Android项目, 通过activity_xxx.xml布局文件来添加组件来达到自己 ...

随机推荐

  1. 秘密袭击 [BZOJ5250] [树形DP]

    分析: 听说正解是FFT+线段树合并,然而我并不会... 我们来思考其他的方法. 我们要求的是连通块第k大的和 对于某一个连通块,对答案的贡献=val(Rank.K) 我们不好直接算出每个连通块的Ra ...

  2. 重新看待Jar包冲突问题及解决方案

    Jar包冲突是老生常谈的问题,几乎每一个Java程序猿都不可避免地遇到过,并且也都能想到通常的原因一般是同一个Jar包由于maven传递依赖等原因被引进了多个不同的版本而导致,可采用依赖排除.依赖管理 ...

  3. 匈牙利算法--java

    先上例题 杭电acm 2063 :http://acm.hdu.edu.cn/showproblem.php?pid=2063 bool 寻找从k出发的对应项出的可增广路 { while (从邻接表中 ...

  4. java内存配置举例

    常见配置举例  堆大小设置JVM 中最大堆大小有三方面限制:相关操作系统的数据模型(32-bt还是64-bit)限制:系统的可用虚拟内存限制:系统的可用物理内存限制.32位系统下,一般限制在1.5G~ ...

  5. BMFont制作美术字体

    生成 Number.fnt.Number_0.png 两个文件,将其拖入Unity 相应位置,继续下一步 箭头所指就是我们要得到的最终目标,在文本处字体使用它就可以了. 在使用 Tools -> ...

  6. [Web 前端] VML、SVG、Canvas简介

    1.VML: VML的全称是Vector Markup Language(矢量可标记语言),矢量的图形,意味着图形可以任意放大缩小而不损失图形的质量,这在制作地图上有很大用途,VML只是被IE支持. ...

  7. iOS：类似于网易云音乐的刷新条目显示弹框

    一.介绍 在app中使用刷新控件或者第三方刷新库是最常见的功能,在请求服务器时,获取数据的过程是处于不可见状态的,那么通过这个刷新状态可以给用户以直观的感受,这是增强用户体验的一个相当好的方法.我个人 ...

  8. 【算法随记】Canny边缘检测算法实现和优化分析。

    以前的博文大部分都写的非常详细,有很多分析过程,不过写起来确实很累人,一般一篇好的文章要整理个三四天,但是,时间越来越紧张,后续的一些算法可能就以随记的方式,把实现过程的一些比较容易出错和有价值的细节 ...

  9. quartz集群分布式(并发)部署解决方案

    项目中使用分布式并发部署定时任务,多台跨JVM,按照常理逻辑每个JVM的定时任务会各自运行,这样就会存在问题,多台分布式JVM机器的应用服务同时干活,一个是加重服务负担,另外一个是存在严重的逻辑问题, ...

  10. Javascript 解读与思想

    Javascript 解读与思想 解读:对底层类库功能的理解 思想:对程序架构的部署思维