.
.
.
.
<!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=gb2312" />
<script src="Js/Calendar.js"></script><!-- 这个里面不能写javascript代码 -->
<link href="Css/TestDate.css" rel="stylesheet">
<link href="Css/calendar-blue.css" rel="stylesheet">
<title>无标题文档</title>
<script>
function checkform(){
var username = document.regform.txtUserName.value;
if(username == ""){
alert("用户名不能为空！");
return false;
}
var password = document.regform.txtPassWord.value;
if(password == ""){
alert("密码不能为空！");
return false;
}
if(password.length < 6 ){
alert("密码长度必须不小于六位！");
return false;
}
var email = document.regform.txtEmail.value;
if(email.search("^\\w+([-+.]\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$")!=0) {
alert("请输入正确的邮件格式");
return false;
}
return true;
}
</script>
<style type="text/css">
<!--
.STYLE1 {color: #FF0000}
-->
</style>
</head>
<body>
<pre>
<p>表单验证的步骤：</p>
<p>1、确定事件：在表单提交时，触发方式是：单击“submit”按钮。</p>
<p>要使用表单提交事件。<form onsubmit="">是表单标签的onsubmit事件。 </p>
<p>2、确定函数：checkform函数做为表单验证函数。</p>
<p>该函数要有一个boolean类型的返回值 。true表示验证成功可以提交，false表示验证失败不可以提交。默认为true; </p>
<p><script><br />
function checkform(){
}<br />
</script></p>
<p>3、调用格式：在表单提交事件的调用格式上有要求：<form onsubmit="<span class="STYLE1">return</span> checkform()"></p>
<p>在函数名前必须加return关键字
</p>
</pre>
<hr />
<form id="regform" name="regform" method="post" action="提交目标.html" onsubmit="return checkform()">
<p>用户名：
<input type="text" name="txtUserName" />
</p>
<p>密码：
<input type="password" name="txtPassWord" />
</p>
<p>确认密码：
<input type="password" name="txtRePassWord" />
</p>
<p>邮箱：
<input type="text" name="txtEmail" />
</p>
<p>---个人信息---</p>
<p>姓名：
<input type="text" name="textfield5" />
</p>
<p>性别：
<input type="radio" name="rdoSex" value="1" />
男
<input type="radio" name="rdoSex" value="0" />
女
<input type="radio" name="rdoSex" value="2" />
保密
</p>
<p>出生日期：
<input type="text" name="txtBirthday" readonly /><A onclick="return showCalendar('txtBirthday', 'y-mm-dd');" href="#"><img src="Image/Button.gif" id="IMG2" align="absMiddle" border="0" /></A>
</p>
<p>有效证件：
<select name="select">
<option value="1">身份证</option>
<option value="2">军官证</option>
<option value="3">驾驶证</option>
<option value="4">护照</option>
<option value="5">好人证</option>
<option value="6">坏人证</option>
<option value="7">帅哥证</option>
<option value="8">美女证</option>
<option value="9">人妖证</option>
</select>
<input type="text" name="textfield7" />
</p>
<p>个人爱好：
<input type="checkbox" name="cbox" value="1" />
打篮球
<input type="checkbox" name="cbox" value="2" />
电影
<input type="checkbox" name="cbox" value="3" />
男人
<input type="checkbox" name="cbox" value="4" />
女人
<input type="checkbox" name="cbox" value="5" />
大人
<input type="checkbox" name="cbox" value="6" />
小孩
<input type="checkbox" name="cbox" value="7" />
宅女</p>
<p>备注：
<textarea name="textfield8" cols="40" rows="6"></textarea>
</p>
<p>
<input type="submit" name="Submit" value="提交" />
</p>
</form>
</body>
</html>