1、数据有效行性,安全性验证。3层验证。1、客户端 js脚本验证
2、服务端 java-servlet 服务器语言验证
3、数据库 数据库约束
2、onsubmit 表单提交事件。form表单元素相应事件,点击提交按钮触发。(type=”submit”)onsubmit会接收true或false返回值。
返回true提交当前表单,
返回false,不提交表单
3、string对象。字符串对象的方法:字符串对象.方法名();
常用方法:
tolowercase() 把字符串转化为小写
touppercase() 把字符串转化为大写
charat(index) 返回指定位置的字符
indexof(字符串,index) 查找某个指定的字符串中首次出现的位置
substring(zindex1.index2) 返回位于指定索引index1和index2之间的字符串,并且包括索引index1对应的字符,不包括索引index2对应的字符
电子邮件格式验证:
1、使用getelementbyid()获取email的值
使用字符串方法indexof( ) 判断email的值是否包含“@”和“.”符号。
根据函数返回值是true还是flase来决定是否提交表单
var mail=document.getelementbyid("email").value;
if(mail.indexof("@")==-1){
alert("email格式不正确\n必须包含@");
return false;
}
2、使用string对象的length属性验证密码的长度
var pwd=document.getelementbyid("pwd").value;
if(pwd.length<6){
alert("密码必须等于或大于6个字符");
return false;
}
3、验证两次输入密码是否一致
var repwd=document.getelementbyid("repwd").value;
if(pwd!=repwd){
alert("两次输入的密码不一致");
return false;
}
4、使用length属性获取文本长度,使用for循环和substring()方法依次截断单个字符,判断每个字符是否是数字
var user=document.getelementbyid("user").value;
for(var i=0;i<user.length;i++){
var j=user.substring(i,i+1)
if(isnan(j)==false){
alert("姓名中不能包含数字");
return false;
}
}
5 、文本框对象的属性、方法和事件事件:
onblur 失去焦点,当光标离开某个文本框时触发
onfocus 获得焦点,当光标进入某个文本框时触发
onkeypress 某个键盘按键被按下并松开
方法:
blur() 从文本域中移开焦点
focus() 在文本域中设置焦点,即获得鼠标光标
select() 选取文本域中的内容
属性:
1、清除文本框中初始内容,并设置边框为红色:
function cleartext(){
var mail=document.getelementbyid("email");
if(mail.value=="请输入正确的电子邮箱"){
mail.value="";
mail.style.bordercolor="#ff0000";
}
}
……
<td>email:<input id="email" type="text" class="inputs" value="请输入正确的电子邮箱" onfocus="cleartext()"/></td>
</tr>
2、当用户输入无效的电子邮件地址,email文本框中的内容将被自动选中并且高亮显示,提示用户重新输入
if(mail.indexof("@")==-1 || mail.indexof(".")==-1){
alert("email格式不正确\n必须包含符号@和.");
document.getelementbyid("email").select();
return false;
}
3、提示email不能为空
function checkemail(){
var mail= document.getelementbyid ("email");
var pid= document.getelementbyid ("pemail");
pid.innerhtml="";
if(mail.value==""){
pid.innerhtml="email不能为空";
return false;
}
}
……
<input id="email" type="text" class="inputs" onblur="checkemail()"/>
<p class="red" id="pemail"></p>
id 设置或返回文本域的id
value 设置或返回文本域的value属性的值
以上就是如何利用javascript进行表单验证的详细内容。