获取验证码，倒计时防止页面刷新后重新获取

在登录或注册中少不了通过手机号获取验证码。
一般获取验证码后会进行倒计时防止用户过快重复获取验证码。

var timer,enable = true;
$('#sendcode').click(function(e){
	if(!enable || timer){
		return ;
	}
	enable = !enable;
	setTimeout(function(){ //模拟异步请求
		//获取验证码后提示，按钮显示倒计时
		var _dura = 60;
		timer = setInterval(function(){
			_dura--;
			//设置按钮文字
			···
			if(_dura === 0){
				enable = true
				clearInterval(timer);
				timer = null；
				//设置按钮文字
				···
			}
		},1000)
		//ajax error 中设置enable = true
	},1000)
})

虽然可以实现，但是浏览器刷新一下就可以重新获取了。可以把倒计时存到cookie中。

	//引入jqeury.cookie.js
	//定时器中设置倒计时时，更新cookie中的倒计时值。
	$.cookie("sendCode", 60, { expires: 1 });
	
	//在页面记载完成后获取cookie对应值。如果有对应值，则开始倒计时
	if($.cookie("sendCode")){
		var _dura = $.cookie("sendCode");
		timer = setInterval(function(){
			_dura--;
			//设置按钮文字
			···
			if(_dura === 0){
				enable = true
				clearInterval(timer);
				timer = null；
				//设置按钮文字
				···
			}
		},1000)
	}

当然存到cookie中后如果用户手动清除cookie，还是可以重新获取验证码。可以让服务器端配合实现

//后台提供接口，通过sesstionid判断是否可重新获取
//ajax 判断按钮是否可用 ，如果不可用进行倒计时。
$.ajax({
		url: "/getCode",
       success: function (res) {
           if (res.code === '000000' && res.data.countdown != 0) {
               var _dura = res.data.countdown;
               timer = setInterval(function(){
					_dura--;
					//设置按钮文字
					if(_dura === 0){
						enable = true
						clearInterval(timer);
						timer = null；
						//设置按钮文字
					}
				},1000)
           }
       },
       error: function (res) {
       }
   });