1.姓名只能是汉字
var nameCheck =/^[\u4e00-\u9fa5]{2,21}$/;
if(!nameCheck .test(name)){
alert("输入的'姓名'中含有非汉字字符!");
return false;
}
2.简单的身份证校验(校验内容包括数字,位数,以及末尾的x,X)
var idNoCheck = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
if(!idNoCheck .test(idNo)){
alert("输入的'身份证号码'不合法!");
return false;
}
3.简单的手机号码校验(号码第二位可以参考运营商定义的号段)
var phoneNoCheck = /^(1[0-9]{10})$/;
if(!phoneNoCheck .test(phoneNo )){
alert("输入的'手机号码'不合法!");
return false;
}
4.简单的地址防特殊字符校验
var specialKey = "[`·~!$^&*()=|{}':;'\\[\\].<>/?~!¥……&*()——|{}【】‘;:”“'。、?]‘'";//去掉#和,
for(var i = 0; i < specialKey.length; i++) {
if(address.indexOf(specialKey[i]) != -1){
alert("输入的'地址'含有非法字符!");
return false;
}
}
5.特殊键位禁止输入
function checkKeys() {
if (( event.keyCode > 32 && event.keyCode < 48) ||
( event.keyCode > 57 && event.keyCode < 65) ||
( event.keyCode > 90 && event.keyCode < 97)
) {
event.returnValue = false;
}
}
6.文本域长度简单控制
<td>
<textarea cols="25" rows="5" name="AA" id="AA" onpropertychange="if(value.length>100) value=value.substr(0,100)" >BB</textarea>
</td>
7.账号位数和非空的判断控制
//登陆密码输入控制:非空
//账号 必须五位
function sLoginPwCtrl(obj){
var sloginPw = document.getElementById("SuppwCtrl").value;//获得密码输入框中的值
var superAcc = document.getElementById("SupAccCtrl").value;//获得账号输入框中的值
//情况1,用户不输入账号,那么让提交按钮失效并返回一个提示到lable标签
if( superAcc == null || superAcc == "" || superAcc == undefined ){
document.getElementById('sloginSub').disabled = true;
document.getElementById('sloginlable1').innerHTML = "请输入账户";
sLoginPwCtrl(this);
}
//情况2,用户输入账号位数步符合要求,那么让提交按钮失效并返回一个提示到lable标签
else if( superAcc.length != 5 ){
document.getElementById('sloginSub').disabled = true;
document.getElementById('sloginlable1').innerHTML = "账户非法";
sLoginPwCtrl(this);
}
//情况3,用户输入步输入密码,那么让提交按钮失效并返回一个提示到lable标签
else if( sloginPw == null || sloginPw == "" || sloginPw == undefined ){
document.getElementById('sloginSub').disabled = true;
document.getElementById('sloginlable2').innerHTML = "请输入密码";
sLoginPwCtrl(this);
}
//排除不合法操作后的其他操作,按钮有效,并清其操作留下的提醒
else{
document.getElementById('sloginSub').disabled = false;
document.getElementById('sloginlable').innerHTML = "";
}
}
8.仅仅能输入8位数字的输入控制
<!--仅仅能输入8位数字的输入控制-->
function check(obj){
var maxChars = 8;
if(isNaN(obj.value)){
document.getElementById('kahaolable').innerHTML = "*卡号只能是数字";
document.getElementById('sub').disabled = true;
}
else if(obj.value.length != maxChars){
document.getElementById('kahaolable').innerHTML = "*卡号应为8位数字";
document.getElementById('sub').disabled = true;
}
else{
document.getElementById('sub').disabled = false;
document.getElementById('kahaolable').innerHTML = "";
var inputValue = document.getElementById("demo1").value;
obj.value = inputValue;
}
}
9.修改密码输入控制
//修改密码控制
function upPswIn(obj){
var myvalue1 = document.getElementById("upYuan").value;
var myvalue2 = document.getElementById("upNew1").value;
var myvalue3 = document.getElementById("upNew2").value;
if( myvalue1 == null || myvalue1 == "" ){
document.getElementById('upPwSub').disabled = true;
document.getElementById('upLable1').innerHTML = "请正确输入原密码";
upPswIn(this);
}
else if( myvalue2 == null || myvalue2 == "" || myvalue2 == undefined ){
document.getElementById('upPwSub').disabled = true;
document.getElementById('upLable1').innerHTML = "";
document.getElementById('upLable2').innerHTML = "请输入新密码";
upPswIn(this)
}
else if( myvalue3 == null || myvalue3 == "" || myvalue3 == undefined ){
document.getElementById('upPwSub').disabled = true;
document.getElementById('upLable1').innerHTML = "";
document.getElementById('upLable2').innerHTML = "";
document.getElementById('upLable3').innerHTML = "请再次输入新密码";
upPswIn(this)
}
else
if( myvalue2 != myvalue3){
document.getElementById('upPwSub').disabled = true;
document.getElementById('upLable2').innerHTML = "两次密码不一致";
upPswIn(this)
}
else{
document.getElementById('upPwSub').disabled = false;
document.getElementById('upLable1').innerHTML = "";
document.getElementById('upLable2').innerHTML = "";
document.getElementById('upLable3').innerHTML = "";
}
}
最后
为了帮助大家让学习变得轻松、高效,给大家免费分享一大批资料,帮助大家在成为全栈工程师,乃至架构师的路上披荆斩棘。在这里给大家推荐一个前端全栈学习交流圈:866109386.欢迎大家进群交流讨论,学习交流,共同进步。
当真正开始学习的时候难免不知道从哪入手,导致效率低下影响继续学习的信心。
但最重要的是不知道哪些技术需要重点掌握,学习时频繁踩坑,最终浪费大量时间,所以有有效资源还是很有必要的。
最后祝福所有遇到瓶疾且不知道怎么办的前端程序员们,祝福大家在往后的工作与面试中一切顺利。