本文介绍了如何在JavaScript中封装手机、邮箱及密码的正则验证方法。通过定义checkPhone、checkMail和checkPwd函数，利用jQuery获取输入值并应用特定正则规则进行格式校验，提示用户重新填写或标记验证状态，适用于前端表单基础验证场景。
手机验证封装
本文介绍JavaScript中针对手机、邮箱及密码验证的正则表达式封装方法，首先从手机验证开始。
以下代码展示了验证手机号码的正则表达式实现逻辑。
【checkPhone】：这是该验证方法的函数名称；
【phoneId】：这是方法的参数，代表获取手机号码的HTML元素的ID，通常对应input元素的id属性；
【$(phoneId).val()】：这是使用jQuery通过ID获取input元素值的方式；
【手机匹配的正则表达式】：
/^1[2|3|4|5|6|7|8|9|]\d{9}$/
/*手机验证*/
function checkPhone(phoneId) {
// var phone = document.getElementById(phoneId);
// var phone_value = phone.value;
var phone_value = $(phoneId).val();
if (!(/^1[2|3|4|5|6|7|8|9|]\d{9}$/.test(phone_value))) {//手机匹配的正则表达式
alert("手机号码格式有误，请重新填写！");
$(phoneId).focus();
mail = 0;
return false;
} else {
mail = 1;
}
}邮箱验证封装
【邮箱验证】：以下代码展示了验证邮箱的正则表达式实现逻辑。
【checkMail】：这是该验证方法的函数名称；
【mailId】：这是方法的参数，代表获取邮箱的HTML元素的ID，通常对应input元素的id属性；
【$(phoneId).val()】：这是使用jQuery通过ID获取input元素值的方式；
【邮箱匹配的正则表达式】：
/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9])+
/*邮箱验证*/
function checkMail(mailId) {
//var mail_id = document.getElementById(mailId);
//var regMail = mail_id.value;
var regMail_value = $(mailId).val();
var regMail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9])+/;//邮箱匹配的正则表达式
if (!(regMail.test(regMail_value))) {
alert("邮箱号码格式有误，请重新填写！");
$(mailId).focus();
phone = 0;
return false;
} else {
phone = 1;
}
}密码验证封装
【密码验证】：以下代码展示了验证密码的正则表达式实现逻辑。
【checkPwd】：这是该验证方法的函数名称；
【pwdId】：这是方法的参数，代表获取密码的HTML元素的ID，通常对应input元素的id属性；
【$(pwdId).val()】：这是使用jQuery通过ID获取input元素值的方式；
【密码匹配的正则表达式】：
/^[0-9a-zA-Z_-]{6,10}/
密码的正则表达式可以根据实际业务需求进行调整；
/*密码验证*/
function checkPwd(pwdId) {
var regPwd_value = $(pwdId).val();
var regPwd = /^[0-9a-zA-Z_-]{6,10}/;//密码匹配的正则表达式
if (!(regPwd.test(regPwd_value))) {
alert("您的密码包含特殊字符！请输入数字、字母或者“-”和“_”这些组合的6到10位密码！");
$(pwdId).focus();
pwd = 0;
return false;
} else {
pwd = 1;
}
}总结
到此这篇关于javascript手机验证、邮箱验证、密码验证正则表达式简单封装的文章就介绍到这了,更多相关js手机 邮箱 密码验证正则表达式内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！