js实现发送短信验证码后60秒倒计时

                     js实现发送短信验证码后60秒倒计时

效果图：

要多次点击只能在限定60秒内起一次作用，不能开启多个timer，这样效果会错乱

<div class="verification">
<label for="code"><i class="am-icon-code-fork"></i></label>
<input type="tel" name="" id="code" placeholder="请输入验证码">
<a class="btn" href="javascript:void(0);" id="sendMobileCode">
    <span id="dyMobileButton">获取验证码</span>
</a>
</div>

JQuery的脚本语言

<script>
var vercode	 = 0;
	var time = 60;
	var flag = true;   //设置点击标记，防止60内再次点击生效

		//发送验证码
        $('#dyMobileButton').click(function(){
            $(this).attr("disabled",true);
			var phone = $('#phone').val();
            if(flag){
                var timer = setInterval(function () {

                    if(time == 60 && flag){
                        flag = false;

                        $.ajax({
                            type : 'get',
                            async : false,
                            url : 'sms.do',
                            data : {
                                "phone" : phone
                            },
                            dataType:"json",
                            success : function(data) {
                                if(data.status == 0){
                                    vercode = data.data;
                                    $("#dyMobileButton").html("已发送");
								}else {
                                    alert(data.msg);
                                    flag = true;
                                    time = 60;
                                    clearInterval(timer);
                                }
                            }
                        });
					}else if(time == 0){
                        $("#dyMobileButton").removeAttr("disabled");
                        $("#dyMobileButton").html("免费获取验证码");
                        clearInterval(timer);
                        time = 60;
                        flag = true;
                    }else {
                        $("#dyMobileButton").html(time + " s 重新发送");
                        time--;
                    }
                },1000);
			}

		});

        //手机号注册
        $('input[name= "submit_phone"]').click(function(){
            var  reader_com_check  = $('#reader-me').attr("checked");
//            if(reader_com_check != true) {
//                alert("请先点击确认商城服务协议再进行注册");
//                return false;
//			}
		  var code = $('#code').val();
		  if(vercode != code) {
		      alert("请输入正确的验证码");
		      $('#code').val("");
		  }else {
		      var phone = $('#phone').val();
		      var password = $('#password1').val();
		      var passwordRepeat = $('#passwordRepeat1').val();
		      if(password != passwordRepeat){
		          alert("您输入的密码不一致，请从新输入");
                  $('#password1').val("");
                  $('#passwordRepeat1').val("");
		          return false;
			  }
              var form = new FormData();
              form.append("phone", phone);
              form.append("password", password);

              $.ajax({
                  url:"register.do",
                  type:"post",
                  data:form,
                  processData:false,
                  contentType:false,
                  success:function(data){
                      if(data.status == 0){
                          alert(data.msg);
                          window.location.href = "init_login_page.do";
                      }else if(data.status == 1){
                          alert(data.msg);
                      }

                  },
                  error:function(e){
                      alert("错误提交！");

                  }
              });
		  }
        });


	</script>