例1，验证email邮箱格式。
功能实现：
在输入框内输入信息。
如果框内信息为空，会出现提示：登陆邮箱不能为空！(红色文字)
如果框内信息格式不为邮箱格式，会出现提示：请输入常用邮箱！(红色文字)
如果框内信息格式为正确邮箱格式，会出现提示：你输入的邮箱格式正确 (绿色文字)
此测试由两个函数构成，checkEmail函数用来检测邮箱格式，test函数用来测试输入框内信息。
拷贝下代码可直接浏览效果。可根据具体需要进行修改。
代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WEB STARTING --- 验证邮箱</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script language="javascript" type="text/javascript">
//验证邮箱，正确返回true，错误返回false
function checkEmail(email){
var emailRegExp = new RegExp( "[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?");
if (!emailRegExp.test(email)||email.indexOf('.')==-1){
return false;
}else{
return true;
}
}
//验证输入框内信息，并给出对应提示
function test(obj){
if(obj=="mail"){
var email=$.trim($("input[name='mail']").val());
if(email==""){
$("#tishi_mail").html("<p>登陆邮箱不能为空！</p>");
$("#tishi_mail p").addClass("tsTxt_error");
}else{
if(!checkEmail(email)){
$("#tishi_mail").html("<p>请输入常用邮箱！</p>");
$("#tishi_mail p").addClass("tsTxt_error");
}else{
$("#tishi_mail").html("<p>你输入的邮箱格式正确</p>");
$("#tishi_mail p").addClass("tsTxt");
};
}
}
};
</script>
<style type="text/css">
body{color:#fff;font-weight:bold;background:#333}
.tsTxt_error{width:200px;height:20px;line-height:20px;color:#F00;padding:0 10px;}
.tsTxt{width:200px;height:20px;line-height:20px;color:#0C0;padding:0 10px;}
</style>
</head>
<body>
<p>在此框内输入邮箱地址，点击框外会出现会出现对应测试信息</p>
<input type="text" class="kuang" name="mail" onblur="test('mail')" value="输入你的邮箱" onfocus="if(value=='输入你的邮箱'){value=''}" id="input_mail" />
<div id="tishi_mail"></div>
<a
</body>
</html>
<script language=javascript>
function mail_test()
{
email=f1.mail.value;
if(!/^w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*$/.test(email))
{
alert("mail格式不对，请重新输入");
f1.mail.focus();
return false;
}
}
</script>
<form name="f1" onsubmit="return mail_test();">
<input name="mail">
<input value="确定" type="submit">
</form>
或者
<script language=javascript>
function checkEmail(cEmail) //验证邮箱地址是否正确，cEmail为邮箱地址。
{if(cEmail.match(/[w-]+@{1}[w-]+.{1}w{2,4}(.{0,1}w{2}){0,1}/ig)!=cEmail)
return false
else
return true}
</script>
<input id=zz><input type=button value=check onclick="if(checkEmail(zz.value))alert('正确');else alert('错误')">
与众多jquery验证邮箱格式的方法不同，js代码验证email是否正确，有时代码会更简洁，结合正则在一起，效果也还是蛮不错的。
一起继续学习，来看例2.
例2，js验证邮箱格式。
例3，一个正侧表达式在javascript中验证邮箱格式。
例4，一句话验证邮箱格式。
if(!/^w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*$/.test('email'))
{
alert('email不正确');
}
例5，js验证邮箱格式。
function isEmail(email)
{
invalidChars = " /;,:{}[]|*%$#!()`<>?";
if (email == "")
{
return false;
}
for (i=0; i< invalidChars.length; i++)
{
badChar = invalidChars.charAt(i)
if (email.indexOf(badChar,0) > -1) {
return false;
}
}
atPos = email.indexOf("@",1)
if (atPos == -1) { return false; }
if (email.indexOf("@", atPos+1) != -1) { return false; }
periodPos = email.indexOf(".",atPos)
if(periodPos == -1) {
return false; // and at least one "." after the "@"
}
if ( atPos +2 > periodPos) {
return false; // and at least one character between "@" and "."
}
if ( periodPos +3 > email.length) { return false; }
return true;
}
aspx: 调用:
<input id=zz><input type=button value=check onclick="if(isEmail(zz.value))alert('正确');else alert('错误');