<!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. HDU - 6208 The Dominator of Strings HDU - 6208 AC自动机 || 后缀自动机

    https://vjudge.net/problem/HDU-6208 首先可以知道最长那个串肯定是答案 然后,相当于用n - 1个模式串去匹配这个主串,看看有多少个能匹配. 普通kmp的话,每次都要 ...

  2. 性能测试工具LoadRunner08-LR之Virtual User Generator 检查点

    步骤: 1.点击Vuser--->Run-Time Settings 2.点击Preferences--->Enable Image and text check 3.点击Content ...

  3. informix(南大通用)sql语法的差异

    1.create view  444(...)  as select ...from... 2.insert into select.......union  select     不支持 请分开写 ...

  4. (转)Shell学习之Shift的用法

    Shell学习之Shift的用法 原文:https://www.cnblogs.com/sunfie/p/5943753.html 位置参数可以用shift命令左移.比如shift 3表示原来的$4现 ...

  5. git 基础教程

    git 提交 全部文件 git add .  git add xx命令可以将xx文件添加到暂存区,如果有很多改动可以通过 git add -A .来一次添加所有改变的文件.注意 -A 选项后面还有一个 ...

  6. 关于java中char占几个字节，汉字占几个字节

    我们平常说,java中char占2个字节,可又说汉字在不通的编码格式中所占的位数是不同的,比如gbk中汉字占2个字节,utf8中多数占3个字节,少数占4个.而所有汉字在java程序中我们都可以简单的用 ...

  7. typescript的lambads解决this关键字找不到属性

    var people = { name: ["abc", "jack", "pepter", "jim"], getna ...

  8. Redis-Service.Stack的初级使用

    主要解决Redis服务器带有密码的情况下初始化. 创建RedisHelper类,直接贴代码: using ServiceStack.Redis;using System;class RedisHelp ...

  9. DOS常见命令

    dir: 显示一个目录中的文件和子目录 md: 创建目录 rd: 删除目录 cd: 进入指定目录 cd..: 退回到上级目录 cd\: 退回到根目录 del: 删除文件 set: 显示.设置.删除cm ...

  10. jquery常用属性与方法

    1..css( )给指定的样式设置样式值: 2..attr(attributeName,value) /.removeAttr(attributeName);给指定的属性设置值 / 清除所有匹配的元素 ...