表单验证
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Register.aspx.cs" Inherits="Public_Register" %>
<!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 runat="server">
<title></title>
<link href="../css/common.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src="../js/default.js"></script>
<style type="text/css">
.reg_dh{
width:960px;
height:47px;
background:url(../image/reg_01.gif);
}
.reg_TolineHeight ul{
line-height:25px;
padding-left:10px;
}
.reg_dhA{
height:35px;
background:url(../image/index_48.gif);
font-size:14px;
font-weight:bold;
line-height:35px;
text-indent:10px;
}
.reg_Content{
margin:5px 0px;
}
.reg_Content ul{
padding:0px 0px 0px 50px;
clear:both;
}
.reg_Content li{
float:left;
}
.reg_Content .liA{
height:35px;
line-height:35px;
width:80px;
}
.reg_Content .liB{
width:300px;
height:35px;
line-height:30px;
padding-top:5px;
}
.reg_Content .liC{
display:none;
}
.reg_Content #TBUname,#TBEmail,#TBTelCNumber,#TBPNumber,#TBTelTNumber,#TBCZCNumber,#TBCZPNumber,#TBCZTNumber,#TBMobelNumber,#TBComName,#TBComAdress,#TBPost,#TBValid{
height:20px;
border:1px solid #7F9DB9;
background:url(../image/index_04.gif);
background-repeat:no-repeat;
color:#CCC;
font-size:14px;
}
.reg_Content #TBWSelectDDL,#DDDLCustomerTyep,#DDLComLay,#DDLHangYe{
height:25px;
border:1px solid #7F9DB9;
color:#CCC;
width:250px;
}
.submit {
background:transparent url(/image/btn.jpg) no-repeat scroll 0 0;
border:0 none;
cursor:pointer;
font-size:14px;
font-weight:bold;
height:28px;
text-align:center;
width:232px;
}
.inputW250{
width:247px!important;
width:245px;
}
.inputW70{
width:77px;
}
.submitdiv{
padding-left:350px;
padding-bottom:10px;
}
#RBLSex{
border:0px;
padding:0px;
}
.onfocus{
display:;
line-height:33px;
height:33px;
width:528px;
background:url(../image/alert1.gif) no-repeat;
background-position:10px;
text-indent:30px;
color:#0055aa;
background-color:#E5F5FF;
border:1px dashed #40B3FF;
}
.right{
display:;
line-height:35px;
height:35px;
width:530px;
background:url(../image/right1.gif) no-repeat scroll left;
}
.wrong{
display:;
line-height:33px;
height:33px;
width:528px;
color:#C00;
text-indent:30px;
background:url(../image/error1.gif) no-repeat;
background-position:10px;
background-color:#FFF2F2;
border:1px dashed #FF8080;
}
</style>
</head>
<body>
<!--#include file="/files/head_index.html" -->
<form id="form1" runat="server">
<div class="W960 clear reg_dh"></div>
<div class="W960 clear reg_TolineHeight">
<ul>
<li>(1) 带*为必填项,如果注册信息不真实,锦程全球订舱中心有权随时中止对您的会员资格。</li>
<li>(2) 请填写真实有效的个人信息,特别是姓名、联系电话和email地址,以确保您能安全收到我们通过email发送给您的确认信息。</li>
</ul>
</div>
<div class="W960 clear reg_dhA">>姓名和联系方式</div>
<div class="W960 clear reg_Content">
<ul>
<li class="liA">真实姓名*</li>
<li class="liB"><input id="TBUname" type="text" runat="server" class="inputW250" /></li>
<li id="unameDIV" class="liC"></li>
</ul>
<ul>
<li class="liA">性 别*</li>
<li class="liB">
<asp:RadioButtonList RepeatDirection="Horizontal" id="RBLSex" runat="server" CssClass="RBLSex">
<asp:ListItem Selected="True" Value="1">先生</asp:ListItem>
<asp:ListItem Value="2">女士</asp:ListItem>
</asp:RadioButtonList>
</li>
<li class="liC"></li>
</ul>
<ul>
<li class="liA">您的职位</li>
<li class="liB">
<asp:dropdownlist id="TBWSelectDDL" runat="server">
<asp:ListItem>高管</asp:ListItem>
<asp:ListItem>中层管理者</asp:ListItem>
<asp:ListItem>普通员工</asp:ListItem>
</asp:dropdownlist>
</li>
<li class="liC"></li>
</ul>
<ul>
<li class="liA">电子邮箱*</li>
<li class="liB"><input id="TBEmail" type="text" runat="server" class="inputW250" /></li>
<li id="emailDIV" class="liC"></li>
</ul>
<ul>
<li class="liA">固定电话*</li>
<li class="liB">
<input id="TBTelCNumber" type="text" maxlength="4" value="国家区号" runat="server" class="inputW70" />
<input id="TBPNumber" type="text" maxlength="4" value="地区区号" runat="server" class="inputW70" />
<input id="TBTelTNumber" type="text" value="电话号码" runat="server" class="inputW70" />
</li>
<li id="Tel" class="liC"></li>
</ul>
<ul>
<li class="liA">传 真</li>
<li class="liB">
<input id="TBCZCNumber" type="text" maxlength="4" value="国家区号" runat="server" class="inputW70" />
<input id="TBCZPNumber" type="text" maxlength="4" value="地区区号" runat="server" class="inputW70" />
<input id="TBCZTNumber" type="text" value="电话号码" runat="server" class="inputW70" />
</li>
<li id="CZ" class="liC"></li>
</ul>
<ul>
<li class="liA">手 机*</li>
<li class="liB"><input id="TBMobelNumber" type="text" size="20" runat="server" class="inputW250" /></li>
<li id="mobelShow" class="liC"></li>
</ul>
</div>
<div class="W960 clear reg_dhA">>公司信息</div>
<div class="W960 clear reg_Content">
<ul>
<li class="liA">公司名称*</li>
<li class="liB"><input id="TBComName" type="text" size="35" runat="server" class="inputW250" /></li>
<li id="companyName" class="liC"></li>
</ul>
<ul>
<li class="liA">客户类型*</li>
<li class="liB">
<asp:dropdownlist id="DDDLCustomerTyep" runat="server">
<asp:ListItem></asp:ListItem>
<asp:ListItem Value="01">贸易商</asp:ListItem>
<asp:ListItem Value="02">物流商</asp:ListItem>
</asp:dropdownlist>
</li>
<li class="liC"></li>
</ul>
<ul>
<li class="liA">公司区域*</li>
<li class="liB"><asp:dropdownlist id="DDLComLay" runat="server"><!--#include file="../files/Register_area.html" --></asp:dropdownlist></li>
<li class="liC"></li>
</ul>
<ul>
<li class="liA">公司地址*</li>
<li class="liB"><input id="TBComAdress" type="text" size="35" runat="server" class="inputW250" /></li>
<li id="companyAddress" class="liC"></li>
</ul>
<ul>
<li class="liA">邮政编码</li>
<li class="liB"><input id="TBPost" type="text" maxlength="6" size="10" runat="server" class="inputW250" /></li>
<li id="postCode" class="liC"></li>
</ul>
<ul>
<li class="liA">主营行业*</li>
<li class="liB"><asp:dropdownlist id="DDLHangYe" runat="server"><!--#include file="../files/Register_industry.html" --></asp:dropdownlist></li>
<li class="liC"></li>
</ul>
<ul>
<li class="liA">验 证 码*</li>
<li class="liB"><table width="250" border="0" cellpadding="0" cellspacing="0"><tr><td width="81"><input id="TBValid" type="text" size="10" runat="server" /></td><td width="169"><img src='ValidateCode.aspx' id="getcode" onclick="document.getElementById('getcode').src='ValidateCode.aspx?'+Math.random()" style="cursor:pointer;margin-left:10px;"/></td></tr></table>
</li>
<li id="yzm" class="liC"></li>
</ul>
</div>
<div class="clear"><img src="/image/space.gif" width="1" height="20" /></div>
<div class="clear submitdiv">
<asp:Button id="Send" runat="server" Text="同意服务条款,提交注册信息" OnClick="Send_Click" CausesValidation="False" CssClass="submit"></asp:Button>
</div>
<div style="DISPLAY:none" id="show" runat="server">0</div>
</form>
<!--#include file="/files/foot.html" -->
<script type="text/javascript">
var msg =
[
"必填!",
"必填!我们将把会员登录名和密码发送至邮箱,勿使用HotMail、163邮箱注册。",
"必填!如果要输入多个固定电话号码,请使用“/”分隔; 分机号码用“-”分隔!",
"可选项",
"必填!请用中文完整填写在工商局注册的全称。如:上海鸿福货运代理有限公司",
"必填!请在此填写公司主要经营地点。如:海市宁武路35号明远大厦1106-1107室"
]
var onfocus = function(obj,msgdiv,msg){
MM_findObj(msgdiv).innerHTML=msg;
MM_findObj(msgdiv).className="onfocus";
MM_findObj(obj).value="";
}
var onblur = function(obj,msgdiv,msg,reg,bt){
var flag = false;
if(MM_findObj(obj).value=="")
{
MM_findObj(msgdiv).innerHTML=msg;
MM_findObj(msgdiv).className="onfocus";
flag = bt == true ? false : true;
}
else
flag = reg.test(MM_findObj(obj).value) ? ckstr_R(msgdiv) : ckstr_W(obj,msgdiv);
return flag;
}
var ckstr_R = function(msgdiv){
MM_findObj(msgdiv).innerHTML="";
MM_findObj(msgdiv).className="right";
return true;
}
var ckstr_W = function(obj,msgdiv){
MM_findObj(msgdiv).innerHTML="填写有误,请检查
![](https://www.cnblogs.com/Images/dot.gif)
//MM_findObj(obj).style.borderColor="#FF8080";
MM_findObj(msgdiv).className="wrong";
return false;
}
MM_findObj("TBUname").onfocus = function(){onfocus("TBUname","unameDIV",msg[0])};
MM_findObj("TBUname").onblur = function(){onblur("TBUname","unameDIV",msg[0],/.*/,true)};
MM_findObj("TBEmail").onfocus = function(){onfocus("TBEmail","emailDIV",msg[1])};
MM_findObj("TBEmail").onblur = function(){onblur("TBEmail","emailDIV",msg[1],/\b[A-Z0-9._%+-]+@(?!(?:163|hotmail)\.com)[A-Z0-9.-]+\.[A-Z]{2,6}\b/i,true)};
MM_findObj("TBTelCNumber").onfocus = function(){onfocus("TBTelCNumber","Tel",msg[2])};
MM_findObj("TBPNumber").onfocus = function(){onfocus("TBPNumber","Tel",msg[2])};
MM_findObj("TBTelTNumber").onfocus = function(){onfocus("TBTelTNumber","Tel",msg[2])};
MM_findObj("TBTelCNumber").onblur = function(){onblur("TBTelCNumber","Tel",msg[2],/^[0-9]*$/,true)};
MM_findObj("TBPNumber").onblur = function(){onblur("TBPNumber","Tel",msg[2],/^[0-9]*$/,true)};
MM_findObj("TBTelTNumber").onblur = function(){onblur("TBTelTNumber","Tel",msg[2],/^[0-9\/-]*$/,true)};
MM_findObj("TBCZCNumber").onfocus = function(){onfocus("TBCZCNumber","CZ",msg[3])};
MM_findObj("TBCZPNumber").onfocus = function(){onfocus("TBCZPNumber","CZ",msg[3])};
MM_findObj("TBCZTNumber").onfocus = function(){onfocus("TBCZTNumber","CZ",msg[3])};
MM_findObj("TBCZCNumber").onblur = function(){onblur("TBCZCNumber","CZ",msg[3],/^[0-9]*$/,false)};
MM_findObj("TBCZPNumber").onblur = function(){onblur("TBCZPNumber","CZ",msg[3],/^[0-9]*$/,false)};
MM_findObj("TBCZTNumber").onblur = function(){onblur("TBCZTNumber","CZ",msg[3],/^[0-9]*$/,false)};
MM_findObj("TBMobelNumber").onfocus = function(){onfocus("TBMobelNumber","mobelShow",msg[0])};
MM_findObj("TBMobelNumber").onblur = function(){onblur("TBMobelNumber","mobelShow",msg[0],/^[0-9]*$/,true)};
MM_findObj("TBComName").onfocus = function(){onfocus("TBComName","companyName",msg[4])};
MM_findObj("TBComName").onblur = function(){onblur("TBComName","companyName",msg[4],/.*/,true)};
MM_findObj("TBComAdress").onfocus = function(){onfocus("TBComAdress","companyAddress",msg[5])};
MM_findObj("TBComAdress").onblur = function(){onblur("TBComAdress","companyAddress",msg[5],/.*/,true)};
MM_findObj("TBPost").onfocus = function(){onfocus("TBPost","postCode",msg[3])};
MM_findObj("TBPost").onblur = function(){onblur("TBPost","postCode",msg[3],/^[0-9]*$/,false)};
MM_findObj("TBValid").onfocus = function(){onfocus("TBValid","yzm",msg[0])};
MM_findObj("TBValid").onblur = function(){onblur("TBValid","yzm",msg[0],/.*/,true)};
</script>
<script language="javascript">
function checkDate()
{
if(!onblur("TBUname","unameDIV",msg[0],/.*/,true)) return false;
if(!onblur("TBEmail","emailDIV",msg[1],/\b[A-Z0-9._%+-]+@(?!(?:163|hotmail)\.com)[A-Z0-9.-]+\.[A-Z]{2,6}\b/i,true)) return false;
if(!onblur("TBTelCNumber","Tel",msg[2],/^[0-9]*$/,true)) return false;
if(!onblur("TBPNumber","Tel",msg[2],/^[0-9]*$/,true)) return false;
if(!onblur("TBTelTNumber","Tel",msg[2],/^[0-9\/-]*$/,true)) return false;
if(!onblur("TBCZCNumber","CZ",msg[3],/^[0-9]*$/,false)) return false;
if(!onblur("TBCZPNumber","CZ",msg[3],/^[0-9]*$/,false)) return false;
if(!onblur("TBCZTNumber","CZ",msg[3],/^[0-9]*$/,false)) return false;
if(!onblur("TBMobelNumber","mobelShow",msg[0],/^[0-9]*$/,true)) return false;
if(!onblur("TBComName","companyName",msg[4],/.*/,true)) return false;
if(!onblur("TBComAdress","companyAddress",msg[5],/.*/,true)) return false;
if(!onblur("TBPost","postCode",msg[3],/^[0-9]*$/,false)) return false;
if(!onblur("TBValid","yzm",msg[0],/.*/,true)) return false;
}
</script>
</body>
</html>