jQuery 实现 点击按钮后倒计时效果,多用于实现发送手机验证码、邮箱验证码

来源:互联网 发布:淘宝天猫购物券 编辑:程序博客网 时间:2024/06/11 09:10
//发送短信验证码    $(":button.getcode").click(function(){    var reg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;         if(!reg.test($("#mobile").val())){        $('#profile .error_mobile').css('display', 'inline');            return false;        }else{        $('#profile .error_mobile').hide();        }        var countdown = 60;        var _this = $(this);        //设置button效果,开始计时        _this.attr("disabled", "true");        _this.val(countdown + "秒后重新获取");        //启动计时器,1秒执行一次        var timer = setInterval(function(){            if (countdown == 0) {                                clearInterval(timer);//停止计时器                _this.removeAttr("disabled");//启用按钮                _this.val("重新发送验证码");            }            else {                countdown--;                _this.val(countdown + "秒后重新获取");            }        }, 1000);        $.ajax({            type : 'POST',            url : '<%=path%>/user/sendCaptchas',            dataType : 'json',            data : {'stype':'3','ctype':'1','mobile':$("#mobile").val()},            success : function(data) {                if(data.errorInfo.errorCode==''){                    /* alert("短信发送成功"); */                }else{                    alert(data.errorInfo.errorCode);                }            }        });        return false;    });


<input class="getcode" type="button" value="免费发送验证码" />

2 0