<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <title>Insert title here</title>

        <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>

        <style type="text/css">

            .btn {

                width: 100px;

                height: 50px;

                background-color: lightgoldenrodyellow;

            }

        </style>

    </head>

    <body>

        <input type="button" id="btnid" name="butname" value="同意" class="btn" disabled="disabled" /><br /><br />

        <input type="button" id="btnCid" name="butname" value="变化" class="btn" disabled="disabled" />

        <!--    在页面中有一个同意按钮，要求按钮默认不可点击，

在5秒之后才可以点击这个按钮

按钮可用状态时，点击按钮，按钮变为不可用状态，在5秒之后才可以点击这个按钮

-->

        <script type="text/javascript">

            $(function() {

                showNumber();

            })

            function showNumber(){

                for(var i = 1; i <=5; i++) {

                    setTimeout("show("+i+")", i * 1000);//注意setTimeout方法中带参数的方法特殊处理,双引号不能包含变量

                }

            }

            function show(i){

                var x=6-i;

                $("#btnCid").val("变化 "+x);

//                alert(x);

                if(x==1){

                    setTimeout("showbtn()",1000);  //注意 效果有1秒的延迟,所以这里要等上1秒

                }

            }

            function showbtn(){

            alert("可用");

            $("#btnCid").removeProp("disabled");

            }

            $("#btnCid").click(function(){

            disablebtn();

            showNumber();

            })

            function disablebtn(){

            $("#btnCid").prop("disabled","disabled");

        }

        </script>

<!-- 下边这个不带倒计时数字 -->

        <!--<script type="application/javascript">

        $(function(){

            setTimeout("showbtn()",5000);

        });

        function showbtn(){

            alert();

            $("#btnid").removeProp("disabled");

        }

        $("#btnid").click(function(){

            disablebtn();

            setTimeout("showbtn()",5000);

        })

        function disablebtn(){

            $("#btnid").prop("disabled","disabled");

        }

    </script>-->

    </body>

</html>

JQuery 解决按钮上的倒计时问题的更多相关文章

  1. WPF解决按钮上被透明控件遮盖时无法点击问题

    原文:WPF解决按钮上被透明控件遮盖时无法点击问题 IsHitTestVisible="False" 在控件上设置如上属性即可,即可让透明控件不触发点击效果

  2. jQuery实现按钮5秒后可以点击

    废话少说,直接上代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> & ...

  3. 解决IE浏览器中点击按钮上传无效的问题

    前几天写了上传功能,点击按钮上传,在谷歌中是没有任何问题的: 但是在IE浏览器中点击没有任何效果 源代码如下:  后来发现在Firefox.IE浏览器中button标签内部可以含有其他标签,但是不能对 ...

  4. 使用jquery插件uploadify上传文件的方法与疑问

    我是学生一枚,专业也不是计算机,但又要用到很多相关技术,所以在技术基础不牢靠的情况下,硬着头皮在做.最近在做一个小项目需要上传图片,而且是需要用ajax的方式.但是利用jquery的ajax方法总会有 ...

  5. 用最简单的例子实现jQuery图片即时上传

    [http://www.cnblogs.com/Zjmainstay/archive/2012/08/09/jQuery_upload_image.html] 最近看了一些jQuery即时上传的插件, ...

  6. jquery.uploadify文件上传组件

    1.jquery.uploadify简介 在ASP.NET中上传的控件有很多,比如.NET自带的FileUpload,以及SWFUpload,Uploadify等等,尤其后面两个控件的用户体验比较好, ...

  7. jQuery uploadify 文件上传

    uploadify这个插件是基于js里面的jquery库写的.结合了ajax和flash,实现了这个多线程上传的功能.现在最新版为3.2.1. 在线实例 实例预览 Uploadify 在线实例Demo ...

  8. jQuery.uploadify-----文件上传带进度条，支持多文件上传的插件

    借鉴别人总结的uploadify:基于jquery的文件上传插件,支持ajax无刷新上传,多个文件同时上传,上传进行进度显示,控制文件上传大小,删除已上传文件. uploadify有两个版本,一个用f ...

  9. WPF中当鼠标移到按钮上时，按钮的背景图片消失的问题

    如果给按钮设置了背景图片,当鼠标移到按钮上的时候,按钮就好变成一个浅蓝色的按钮,背景图片就消失了,对于这个问题有很多解决方法,我只分享一下我的解决方法. 我第一次用的方式是在按钮中添加一个图片,不用背 ...

随机推荐

  1. jQuery中的事件和动画 以及视频展示效果实例

    经过这几天学习jQuery中的事件和动画,对jQuery更深的认识,接下来先把视频展示效果的代码贴出来,最后把我在学习jQuery事件和动画之后总结的思维导图 <!doctype html> ...

  2. [转]JS 只能输入数字和两位小数的JS

    本文转自:http://blog.sina.com.cn/s/blog_724008890101dgep.html JS代码: <script language="JavaScript ...

  3. Murano Weekly Meeting 2015.09.15

    Meeting time: 2015.September.15th 1:00~2:00 Chairperson:  Serg Melikyan, PTL from Mirantis Meeting s ...

  4. linux上的常用命令

    删除目录及文件 (删除tem目录和所有.xml文件) rm -rf tem/ *.xml 复制文件 cp zoo_sample.cfg zoo.cfg 两台机的目录相互拷贝 scp -r apps/ ...

  5. 但是你没有【But you didn't.】【by Anonymous】

    作者是一位普通的美国妇女,她的丈夫在女儿4岁时应征入伍去了越南战场,从此她便和女儿相依为命.后来,她的丈夫.孩子的爸爸不幸阵亡.她终身守寡,直至年老病逝.她女儿在整理遗物时发现了母亲当年写给父亲的这首 ...

  6. C语言实现通用链表初步(一)

    注意:本文讨论的是无头单向非循环链表. 假设不采用Linux内核链表的思路,怎样用C语言实现通用链表呢? 一种常用的做法是: typedef int element_t; struct node_in ...

  7. pat1046. Shortest Distance (20)

    1046. Shortest Distance (20) 时间限制 100 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue The ...

  8. 【Iperf】iperf测试wlan的性能

    1.概念: iperf命令是一个网络性能测试工具.iperf可以测试TCP和UDP带宽质量. iperf可以测量最大TCP带宽,具有多种参数和UDP特性.iperf可以报告带宽,延迟抖动和数据包丢失. ...

  9. JDBC之Java连接mysql实现增删改查

    使用软件:mysql.eclipse 链接步骤: 1.注册驱动 2.创建一个连接对象 3.写sql语句 4.执行sql语句并返回一个结果或者结果集 5.关闭链接(一般就是connection.stat ...

  10. 解决jQuery在chrome中获取height为0

    笔者之前在一家创业公司做过项目,当时遇到这么一个奇怪的问题,我需要用一个jQuery的height()方法获取一个div的高度,但是在chrome浏览器上面有时可以正常获取,但是同一个页面刷新多几次获 ...