JQ-用户注册用到的图形验证码和短信验证码点击事件

// 点击切换图形验证码 页面加载完后执行,类似window.onload
$(function () {
    var imgCaptcha = $(".img-captcha");
    imgCaptcha.click(function () {
        imgCaptcha.attr("src", "/account/register/img/captcha"+"?random="+Math.random());
    });
});

// 点击发送短信验证码
$(function () {
   var smsCaptcha=$('.short-captcha');  // 获取点击的标签
   function send_sms() {
       var telephone = $('input[name="telephone"]').val();  // 获取input标签name='telephone',用户输入的手机号码
       $.get({
           'url': '/account/register/sms/captcha/',  // 请求url并传data数据给后端(django)request.GET.get("telephone")
           'data': {"telephone": telephone},
           'success': function () {
               var count=30;
               smsCaptcha.unbind("click");  // 点击一次后,取消点击事件
               smsCaptcha.addClass("disabled");  // 点击后增加classname,改变样式
               var timer=setInterval(function () {
                    smsCaptcha.text(count);
                    count--;
                    if (count<0){
                        clearInterval(timer);
                        smsCaptcha.removeClass("disabled");
                        smsCaptcha.text("发送短信验证码");
                        // 时间到了,再次绑定点击事件
                        // smsCaptcha.click(send_sms);  // 第二回点击,快速点击能够请求三次,发三条短信??
                        smsCaptcha.one("click", send_sms)  // 触发一次click事件,每次只发一次短信
                    }
                },1000);
           },
           'fail': function () {
                alert('error')
           }
       })
   }
    // smsCaptcha.click(send_sms);  // 第一回,就算连续点击只能点击一次,发一条短信
    smsCaptcha.one("click", send_sms)  // one(event, function), it's safe to use this way.
});

猜你喜欢

转载自www.cnblogs.com/tangpg/p/9240033.html