jquery按钮倒计时

<!DOCTYPE html>
<html>
<head>
    <title>发送验证码</title>
</head>
<body>
    手机号:<input type="text" name="mobile" value="" id="mobile">
    验证码:<input type="text" name="mobile" value="">

    <input type="button" name="submit" value="验证码" id="sendCode">
</body>
</html>
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
    $(function(){
        $(‘#sendCode‘).click(function(){
            var count = 60; // 发送频率/秒
            var countdown1 = setInterval(function(){
                    $(‘#sendCode‘).attr(‘disabled‘,true).css({‘color‘:‘#b5adad‘});
                    $(‘#sendCode‘).val(‘验证码‘+count+‘s‘);
                    if(count == 0){
                        $(‘#sendCode‘).val(‘验证码‘).removeAttr(‘disabled‘).css({‘color‘:‘#27d6df‘});
                        clearInterval(countdown1);
                    }
                    count--;
            },1000);
        });
    });
</script>

按钮倒计时

时间: 2024-10-21 23:20:23

jquery按钮倒计时的相关文章

js jquery 按钮点击后 60秒之后才能点击 60秒倒计时

var wait = 60; function time(o) { if (wait == 0) { $(o).attr("disabled", false); $(o).val("获取验证码"); wait = 60; } else { $(o).attr("disabled", true); o.val(wait + "秒后重新发送"); wait--; setTimeout(function () {time(o);},

按钮倒计时可用效果实例代码

按钮倒计时可用效果实例代码:很多网页都有这样的效果,那就是按钮必须在指定的倒计时之后才是可用的,下面就通过代码实例介绍一下如何实现此效果.代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title&

js点击按钮倒计时---servlet并接收

在制作网站注册时,遇到了 手机验证码的问题,虽然不是做前端的,但是 作业需要,自己还是老实的写了个按钮倒计时的js事件. 主要实现的功能: 点击下按钮时,开始倒数计时. 当计数为0的时候,回到原状态,不进行计数 再次点击进行计数 实现步骤: 获得id对应的标签 设置该标签value为number--;从60倒数计时 计数为0,设置value=原内容,并将number重新赋值为60 计数不为0就setTimeout重复执行该function <!DOCTYPE html> <html>

jquery实现倒计时

1 <html> 2 <head> 3 <meta charset="utf-8"/> 4 <title>jquery实现倒计时</title> 5 <script src="js/jquery-1.8.3.min.js" type="text/javascript"></script> 6 </head> 7 8 <body> 9 <

iOS 按钮倒计时功能

iOS 按钮倒计时功能, 建议把按钮换成label,这样会避免读秒时闪烁 1 __block int time = 60; 2 __block UIButton *verifybutton = _GetverificationBtn; 3 verifybutton.enabled = NO; 4 dispatch_queue_t queue = dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0); 5 dispatch_so

按钮倒计时

<a id="submit" class="pointer folwbtn">同意(<span id="tdown">9</span>)</a> <script type="text/javascript"> $(function () { var cout = 9; var cdown = setInterval(fndown, 1000); function fn

jQuery实现倒计时效果-杨秀徐

本实例效果:剩余368天22小时39分57秒结束 代码简单易懂,适用各种倒计时: <!DOCTYPE html> <head> <title>jQuery实现倒计时效果-杨秀徐</title> <script type="text/javascript" src="/scripts/jquery.js"></script> <script type="text/javascrip

点击按钮 倒计时60秒方可再次点击发送的Js代码

本节内容:Javascript 实现 点击按钮 倒计时60秒方可再次点击发送的效果. 比如,一些网站上的手机短信认证的功能,有类似实现点击按钮后,倒计时60秒才能再次点击发送的效果. 本文用Javascript实现点击按钮后,倒计时60秒才能再次点击发送验证码的功能. 例子: 复制代码代码示例: <input type="button" id="btn" value="免费获取验证码" /><script type="

注册时验证按钮倒计时

// 按钮点击事件 -(void)startTime{    __block int timeout=30; //倒计时时间    dispatch_queue_t queue = dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0);    dispatch_source_t _timer = dispatch_source_create(DISPATCH_SOURCE_TYPE_TIMER, 0, 0,queue);