您的位置:首页 > Web前端 > JavaScript

JavaScript实现系列常用表单验证

2011-12-15 18:25 585 查看
1.在你的“用户登录名”,“用户实名”,“邮编”,“电子信箱”,“联系电话”,5个文本框中添加失去焦点事件响应方法onfocusout="onKeyHandle(this,1)",

onfocusout="onKeyHandle(this,2)",

onfocusout="onKeyHandle(this,3)",

onfocusout="onKeyHandle(this,4)",

onfocusout="onKeyHandle(this,5)"。

2.在页面脚本中添加一下js代码:

/*

 * 文本框失去焦点事件

 */

function onKeyHandle(obj,param){

 switch(param){

     case 1:     //仅限字母和数字

      onJudge(obj,obj.value.IsAlphaDigit());

      break;

     case 2:     //仅限字母和数字

      onJudge(obj,obj.value.IsPersonName());

      break;

     case 3:     //邮编验证

      onJudge(obj,obj.value.IsZIP());

      break;

     case 4:     //邮编验证

      onJudge(obj,obj.value.IsEmail());

      break;

     case 5:     //邮编验证

      onJudge(obj,obj.value.IsTelephone());

      break;

     default:

   break;

 }

 function onJudge(obj,handle){

  if(!handle){

      obj.style.color="red";

      return false;

     }else{

      obj.style.color="black";

     }

 }

}

/*

 * 只能是字母和数字

 */

String.prototype.IsAlphaDigit = function() {

 var reg = /^[a-zA-Z0-9]+$/g;

 return reg.test(this);

}

/*

 * 只能是中文,英文或数字

 */

String.prototype.IsPersonName= function() {

 var reg = /^(\w|[\u4E00-\u9FA5])*$/;

 return reg.test(this);

}

/*

 * 邮编验证

 */

String.prototype.IsZIP= function() {

 var reg = /^[1-9][0-9]{5}$/;

 return reg.test(this);

}

/*

 * Email验证

 */

String.prototype.IsEmail= function() {

 var reg = /\w@\w*\.\w/;

 return reg.test(this);

}

/*

 * 电话号码验证

 */

String.prototype.IsTelephone= function() {

 var reg = "(^[0-9]{3,4}\-[0-9]{3,8}$)|(^[0-9]{3,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|" +

   "(^0{0,1}13[0-9]{9}$)|(^0{0,1}15[0-9]{9}$)|(^0{0,1}18[0-9]{9}$)";

 var regg = eval('(/'+reg+'/)');

 return regg.test(this);

}

3.相信有一定js基础的一定一看就懂,拿来就用吧!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息