vercode.js封装笔记

211 阅读1分钟

需求说明:

短信验证码功能,有 一个输入框,一个发送按钮。一个项目中很多地方都会使用。

为提高代码复用性。封装成对象。需要的验证码功能的地方,直接引入类。传入参数,初始化就行。这里做一个笔记,以便日后查找

vercode.js代码如下

//定义验证码对象

function Vercode(){

//输入框名字

this.input='';

// button

this.btn='';

//send interface

this.scope='';

}

Vercode.prototype={

//初始化

init:function(){

//数据校验

if(this.ckdata()==false){

return;

}

//绑定

this.bindEvent();

},

//检查数据

ckdata:function(){

if(this.input !='' && this.btn !='' && this.scope != ''){

return true;

}

return false;

},

//绑定事件

bindEvent:function(){

var that=this;

$(this.btn).on({'click':function(){

//检查输入信息

if($(that.input).val() == "" || isNaN($(that.input).val()) || $(that.input).val().length != 11 ){

$(that.input).focus();

alert("请填写正确的手机号!");

return;

}

$(that.btn).addClass("btnnouse");

var time = 60;

$(that.btn).attr("disabled", true);

 

//发送ajax请求

var param=$(that.input).val();

var url=that.scope;

var data={

'phonenumber':param

};

$.post(url,data,function(res){

if(res.data==1){

alert('短信发送成功,请查收');

}else if(res.data==-1){

alert('操作过于频繁,请稍后再试');

}else{

alert('未知错误');

}

},'json');

 

var timer = setInterval(function() {

if (time == 0) {

clearInterval(timer);

$(that.btn).attr("disabled", false);

$(that.btn).val("获取验证码");

$(that.btn).removeClass("btnnouse");

} else {

$(that.btn).val(time + "秒");

time--;

}

}, 1000);

}});

}

}