转自:http://blog.sina.com.cn/s/blog_6abf4a740100ysb5.html
1、验证邮箱的格式
<script type="text/javascript">
function isEmailAddr(elem){
var str=elem.value;
var re=/^[\w-]+(\.[\w]+)*@([\w-]+\.)+[a-zA-z]{2,7}$/;
if(!str.match(re)){
alert("这个不是电子邮件");
return false;
}
else{
return true;
}
}
</script>
<input type="text" name="email" οnchange="isEmailAddr(this)" />
2、验证输入是否为一个正的或着是负的数字
<form name="form1">
<input type="text" id="number" name="number" οnchange="isNumber(this)"/>
</form>
<script type="text/javascript">
function focusElement(form,elementname){
var elem=document.forms[form].elements[elementname];
elem.focus();
elem.select();
}
function isNumber(elem){
var str=elem.value;
var re=/^[-]?\d*\.?\d*$/;
if(!str.match(re)){
alert("输入不是一个正的或负的数字");
setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
return false;
}
else{
return true;
}
</script>
3、检验输入的值的长度是否为16个字符
<form name="form1">
<input type="text" id="len" name="len" οnchange="isLen16(this)"/>
</form>
<script type="text/javascript">
function focusElement(form,elementname){
var elem=document.forms[form].elements[elementname];
elem.focus();
elem.select();
}
function isLen16(elem){
var str=elem.value;
var re=/\b.{16}\b/;
if(!str.match(re)){
alert("您输入的长度没有达到16字符长");
setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
return false;
}
else{
return true;
}
}
</script>
4、检查文本域中是否有一个或者多个字符
<form name="form1">
<input type="text" id="enpty" name="empty" οnchange="isEmpty(this)"/>
</form>
<script type="text/javascript">
function focusElement(form,elementname){
var elem=document.forms[form].elements[elementname];
elem.focus();
elem.select();
}
function isEmpty(elem){
var str=elem.value;
var re=/.+/;
if(!str.match(re)){
alert("输入不为空");
focusing("form1","empty")
return false;
}
}
</script>
完整例子:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">
<!--
Example File From "JavaScript and DHTML Cookbook"
Second Edition
Published by O'Reilly Media
Copyright 2007 Danny Goodman
-->
<html>
<head>
<title>Recipes 8.2, 8.3, and 8.4</title>
<link rel="stylesheet" id="mainStyle" href="../css/cookbook.css" type="text/css" />
<script type="text/javascript">
// validates that the field value string has one or more characters in it
function isNotEmpty(elem) {
var str = elem.value;
var re = /.+/;
if(!str.match(re)) {
alert("Please fill in the required field.");
setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
return false;
} else {
return true;
}
}
//validates that the entry is a positive or negative number
function isNumber(elem) {
var str = elem.value;
var re = /^[-]?\d*\.?\d*$/;
str = str.toString();
if (!str.match(re)) {
alert("Enter only numbers into the field.");
setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
return false;
}
return true;
}
// validates that the entry is 16 characters long
function isLen16(elem) {
var str = elem.value;
var re = /\b.{16}\b/;
if (!str.match(re)) {
alert("Entry does not contain the required 16 characters.");
setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
return false;
} else {
return true;
}
}
// validates that the entry is formatted as an e-mail address
function isEMailAddr(elem) {
var str = elem.value;
var re = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/;
if (!str.match(re)) {
alert("Verify the e-mail address format.");
setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
return false;
} else {
return true;
}
}
// validate that the user made a selection other than default
function isChosen(select) {
if (select.selectedIndex == 0) {
alert("Please make a choice from the list.");
return false;
} else {
return true;
}
}
// validate that the user has checked one of the radio buttons
function isValidRadio(radio) {
var valid = false;
for (var i = 0; i < radio.length; i++) {
if (radio[i].checked) {
return true;
}
}
alert("Make a choice from the radio buttons.");
return false;
}
function focusElement(formName, elemName) {
var elem = document.forms[formName].elements[elemName];
elem.focus();
elem.select();
}
// batch validation router
function validateForm(form) {
if (isNotEmpty(form.name1)) {
if (isNotEmpty(form.name2)) {
if (isNotEmpty(form.eMail)) {
if (isEMailAddr(form.eMail)) {
if (isChosen(form.continent)) {
if (isValidRadio(form.accept)) {
return true;
}
}
}
}
}
}
return false;
}
</script>
</head>
<body>
<h1>Form Validations</h1>
<hr />
<form method="GET" action="cgi-bin/register.pl"
name="sampleForm" οnsubmit="return validateForm(this)">
First Name: <input type="text" size="30" name="name1" id="name1"
οnchange="isNotEmpty(this)" /><br>
Last Name: <input type="text" size="30" name="name2" id="name2"
οnchange="isNotEmpty(this)" /><br>
E-mail Address: <input type="text" size="30" name="eMail" id="eMail"
οnchange="if (isNotEmpty(this)) {isEMailAddr(this)}" /><br>
Your Region: <select name="continent" id="continent">
<option value="" selected>Choose One:</option>
<option value="Africa">Africa</option>
<option value="Asia">Asia</option>
<option value="Australia">Australia/Pacific</option>
<option value="Europe">Europe</option>
<option value="North America">North America</option>
<option value="South America">South America</option>
</select><br>
Licensing Terms:
<input type="radio" name="accept" id="accept1" value="agree" />I agree
<input type="radio" name="accept" id="accept2" value="refuse" />I do not agree
<br>
<input type="reset" /> <input type="submit" />
</form>
</body>
</html>