用户注册页面--ajax.php.js.css
来源：互联网 发布：隐藏图标的软件 编辑：程序博客网 时间：2024/06/05 13:26
<html><head> <meta charset="utf-8"/><title>新用户注册</title> <link rel="stylesheet" href="Common/css/reg.css"/> <link rel="stylesheet" href="Common/css/style.css" /> <script src="Common/js/jquery.js"></script> <script language="javascript" src="Common/js/check.js"></script></head><body onLoad="javascript:register.name.focus()"> <table width="450" border="0" align="center" cellpadding="0" cellspacing="0"> <form id="register" name="register" action="reg_chk.php" method="post" onSubmit="return chkinput(this)"> <tr> <td colspan="5" align="center" valign="middle"><h2>新用户注册</h2></td> </tr> <tr> <td width="81" height="25"><div align="right">用户名：</div></td> <td height="25" colspan="3"> <input id="name" name="name" type="text" onBlur="javascript:chkname(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'" /><input id="c_name" name="c_anme" type="hidden" value="not" > <font color="red">*</font></td> <td height="25"><div id="name1"><font color="#999999">请输入用户名</font></div></td> </tr> <tr> <td height="25"><div align="right">注册密码：</div></td> <td height="25" colspan="3"> <input id="pwd1" name="pwd1" type="password" onBlur="javascript:chkpwd1(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <font color="red">*</font></td> <td width="152"><div id="pwd11"><font color="#999999">请输入密码</font></div></td> </tr> <tr> <td height="25"><div align="right">确认密码：</div></td> <td height="25" colspan="3"> <input id="pwd2" name="pwd2" type="password" onBlur=" javascript:chkpwd2(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <font color="red">*</font></td> <td height="25"><div id="pwd21"><font color="#999999">确认密码</font></div></td> </tr> <tr> <td height="25"><div align="right">密保问题：</div></td> <td height="25" colspan="3"> <input id="question" name="question" type="text" onBlur="javascript:chkquestion(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <font color="red">*</font></td> <td height="25"><div id="question1"><font color="#999999">请填写密码保护问题</font></div></td> </tr> <tr> <td height="25"><div align="right">密保答案：</div></td> <td height="25" colspan="3"> <input id="answer" name="answer" type="text" onBlur="javascript:chkanswer(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <font color="red">*</font></td> <td height="25"><div id="answer1"><font color="#999999">请填写密码保护答案</font></div></td> </tr> <tr> <td height="25"><div align="right">真实姓名：</div></td> <td height="25" colspan="3"> <input id="realname" name="realname" type="text" onBlur="javascript:chkrealname(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <font color="red">*</font></td> <td height="25"><div id="realname1"><font color="#999999">请填写真实姓名</font></div></td> </tr> <tr> <td height="25"><div align="right">身份证号：</div></td> <td height="25" colspan="3"> <input id="card" name="card" type="text" maxlength="18" onBlur="javascript:chkcard(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <font color="red">*</font></td> <td height="25"><div id="card1"><font color="#999999">请输入准确的身份帐号</font></div></td> </tr> <tr> <td height="25"><div align="right">移动电话：</div></td> <td height="25" colspan="3"> <input id="tel" type="text" name="tel" onBlur="javascript:chktel(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <font color="red">*</font></td> <td height="25"><div id="tel1"><font color="#999999">请输入移动电话</font></div></td> </tr> <tr> <td height="25"><div align="right">固定电话：</div></td> <td height="25" colspan="3"> <input id="phone" type="text" name="phone" onBlur="javascript:chkphone(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <font color="red">*</font></td> <td height="25"><div id="phone1"><font color="#999999">请输入固定电话</font></div></td> </tr> <tr> <td height="25"><div align="right">QQ号码：</div></td> <td height="25" colspan="3"> <input id="qq" type="text" name="qq" onBlur="javascript:chkqq(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/></td> <td height="25"><div id="qq1"><font color="#999999">请输入QQ号</font></div></td> </tr> <tr> <td height="25"><div align="right">E-mail：</div></td> <td height="25" colspan="3"> <input id="email" type="text" name="email" onBlur="javascript:chkemail(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/></td> <td height="25"><div id="email1"><font color="#999999">请输入Email</font></div></td> </tr> <tr> <td height="25"><div align="right">邮 编：</div></td> <td height="25" colspan="3"> <input id="code" type="text" name="code" onBlur="javascript:chkcode(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut= "this.style.backgroundColor='#e8f4ff'"/></td> <td height="25"><div id="code1"><font color="#999999">请输入邮编</font></div></td> </tr> <tr> <td height="25"><div align="right">联系地址：</div></td> <td height="25" colspan="3"> <input id="address" type="text" name="address" onBlur="javascript:chkaddress(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <font color="red">*</font></td> <td height="25"><div id="address1"><font color="#999999">请输入联系地址</font></div></td> </tr> <tr> <td height="25"><div align="right">验证码：</div></td> <td width="65" height="25"> <input id="yzm" type="text" name="yzm" size="8" onBlur="javascript:chkyzm(register)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/> <input name="yzm2" type="hidden" value="" /></td> <td width="65" align="center" valign="middle"><script>yzm(register)</script></td> <td width="51"><a href="javascript:code(register)">看不清</a></td> <td height="25"><div id="yzm1"><font color="#999999">输入验证码</font></div></td> </tr> <tr> <td height="25" colspan="2"> <input type="submit" value="提交"/> <input type="reset" value="重写" /></td> <td height="25" colspan="3"><div style="color:#FF0000">带"*"号的为必填项</div></td> </tr> </form> </table></body></html>
check.js
// JavaScript Documentfunction GetXmlHttpObject(){var xmlHttp=null;try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); }catch (e) { //Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } }return xmlHttp;}function chkname(form){if(form.name.value==""){name1.innerHTML="<font color=#FF0000>请输入用户名！</font>";}else{var user = form.name.value;var url="http://192.168.2.43/think_cms/index.php/register/chkname";url=url+"?user_name="+user;var xmlhttp = GetXmlHttpObject();xmlhttp.onreadystatechange = function(){if(xmlhttp.readyState == 4 && xmlhttp.status==200){var msg = xmlhttp.responseText;msg = parseInt(msg);if(msg == 0){name1.innerHTML="<font color=#FF0000>用户名被占用！</font>";return false;}else if(msg == 1){name1.innerHTML="<font color=green>恭喜您，可以注册!</font>";form.c_name.value = "yes";}else{name1.innerHTML="<font color=green>"+msg+"</font>";}}}xmlhttp.open("GET",url,true);xmlhttp.send(null);}}function chkinput(form){if(form.name.value==""){form.name.focus();return false;}if(form.c_name.value == "not"){form.name.select();return false;}if(form.pwd1.value==""){form.pwd1.focus();return false;}if(form.pwd2.value==""){form.pwd2.focus();return false;}if(form.pwd2.value!=form.pwd1.value){form.pwd1.select();return false;}if(form.pwd1.value.length<6){form.pwd1.select();return false;}if(form.question.value == ""){form.question.focus();return false;}if(form.answer.value == ""){form.answer.focus();return false;}if(form.realname.value==""){form.realname.focus();return false;}if(form.card.value==""){form.card.focus();return false;}if(form.card.value.length != 15 && form.card.value.length !=18){form.card.select();return false;}if(form.tel.value==""){form.tel.focus();return false;}if(isNaN(form.tel.value)){form.tel.select();return false;}if(form.phone.value==""){form.phone.focus();return false;}if(isNaN(form.qq.value)){alert("QQ号码只能由数字组成！");form.qq.select();return false;}var i=form.email.value.indexOf("@");var j=form.email.value.indexOf(".");if((form.email.value != "") && ((i<0)||(i-j>0)||(j<0))){form.email.select();return false;}if(isNaN(form.code.value)){form.code.focus();return false;}if(form.code.value.legnth < 6){form.code.select();return false;}if(form.address.value==""){alert('1');form.address.focus();return false;}if(form.yzm.value==""){form.yzm.focus();return false;}if(form.yzm.value!=form.yzm2.value){alert("效验码输入错误！");form.yzm.focus();return false;}}function chkpwd1(form){if(form.pwd1.value==""){pwd11.innerHTML="<font color=#FF0000>密码格式错误！</font>"; }else if(form.pwd1.value.length<6){pwd11.innerHTML="<font color=#FF0000>注册密码长度应大于6位！</font>"; }else{pwd11.innerHTML="<font color=green>输入正确</font>"; }}function chkpwd2(form){if(form.pwd2.value==""){pwd21.innerHTML="<font color=#FF0000>请输入确认密码！</font>"; }else if(form.pwd2.value.length<6){pwd21.innerHTML="<font color=#FF0000>确认密码长度应大于6位！</font>"; }else if(form.pwd1.value!=form.pwd2.value){pwd21.innerHTML="<font color=#FF0000>注册密码与确认密码不同！</font>"; }else{pwd21.innerHTML="<font color=green>输入正确</font>"; }}function chkquestion(form){if(form.question.value==""){question1.innerHTML="<font color=#FF0000>请填写密保问题！</font>"; }else{question1.innerHTML="<font color=green>输入正确</font>"; }}function chkanswer(form){if(form.answer.value==""){answer1.innerHTML="<font color=#FF0000>请填写密保答案！</font>"; }else{answer1.innerHTML="<font color=green>输入正确</font>"; }}function chkrealname(form){if(form.realname.value==""){realname1.innerHTML="<font color=#FF0000>请输入真实姓名！</font>"; }else{realname1.innerHTML="<font color=green>输入正确</font>";}}function chkcard(form){if(form.card.value==""){card1.innerHTML="<font color=#FF0000>请选择您的身份证号！</font>"; }else if(form.card.value.length != 15 && form.card.value.length != 18){card1.innerHTML="<font color=#FF000000>请输入正确的身份证号</font>";}else{card1.innerHTML="<font color=green>输入正确</font>";}}function chktel(form){if(form.tel.value==""){tel1.innerHTML="<font color=#FF0000>请输入联系电话！</font>"; }else if(isNaN(form.tel.value)){tel1.innerHTML="<font color=#FF0000>联系电话只能由数字组成！</font>"; }else if(form.tel.value.length<8 || form.tel.value.length>11){tel1.innerHTML="<font color=#FF0000>联系电话位数不正确！</font>";}else{tel1.innerHTML="<font color=green>输入正确</font>";}}function chkphone(form){if(form.phone.value==""){phone1.innerHTML="<font color=#FF0000>请输入固定电话！</font>"; }else{phone1.innerHTML="<font color=green>输入正确</font>";}}function chkqq(form){if (form.qq.value == ""){qq1.innerHTML="<font color=#FF0000>请输入QQ号码！</font>"; return;}if(form.qq.value != "" && isNaN(form.qq.value)){qq1.innerHTML="<font color=#FF0000>联系QQ只能由数字组成！</font>"; }else{qq1.innerHTML="<font color=green>输入正确</font>";}}function chkemail(form){if (form.email.value==""){email1.innerHTML="<font color=#FF0000>请输入E-mail地址！</font>"; return;}var i=form.email.value.indexOf("@");var j=form.email.value.indexOf(".");if((form.email.value != "") && ((i<0)||(i-j>0)||(j<0))){email1.innerHTML="<font color=#FF0000>请输入正确的E-mail地址！</font>"; }else{email1.innerHTML="<font color=green>输入正确</font>";}}function chkcode(form){if(isNaN(form.code.value)){code1.innerHTML="<font color=#FF0000>邮编只能由数字组成！</font>"; }else if(form.code.value.length!=6){code1.innerHTML="<font color=#FF0000>邮编长度为6位！</font>"; }else{code1.innerHTML="<font color=green>输入正确</font>";}}function chkaddress(form){if(form.address.value==""){address1.innerHTML="<font color=#FF0000>请输入联系地址！</font>"; }else{address1.innerHTML="<font color=green>输入正确</font>";}}function chkyzm(form){if(form.yzm.value==""){yzm1.innerHTML="<font color=#FF0000>请输入效验码！</font>"; }else if(form.yzm.value!=form.yzm2.value){yzm1.innerHTML="<font color=#FF0000>效验码输入错误!</font>";}else{yzm1.innerHTML="<font color=green>输入正确</font>";}}function yzm(form){var num1=Math.round(Math.random()*10000000);var num=num1.toString().substr(0,4);document.write("<img name=codeimg src='yzm.php?num="+num+"'>");form.yzm2.value=num;}function code(form){var num1=Math.round(Math.random()*10000000);var num=num1.toString().substr(0,4);document.codeimg.src="yzm.php?num="+num;form.yzm2.value=num;}reg.css
#name,#pwd1,#pwd2,#question,#answer,#realname,#card,#tel,#phone,#qq,#email,#code,#address {height: 20px;width: 150px;border: 1px solid #003399;background-color:#e8f4ff;} #yzm {height: 20px;width: 50px;border: 1px solid #003399;background-color:#e8f4ff;} #name1,#pwd11,#pwd21,#question1,#answer1,#realname1,#card1,#tel1,#phone1,#qq1,#email1,#code1,#address1,#yzm1 {background-color: #f0f0f0;height: 13px;width: 150px;border: 1px dotted #CCCCCC;}style.css
<!--body,td,th {font-size: 12px;}body {margin-left: 0px;margin-right: 0px;margin-bottom: 0px;margin-top: 0px;}a:link {text-decoration: none;}a:visited {text-decoration: none;}a:hover {text-decoration: none;}a:active {text-decoration: none;}yzm.phpphp验证码实现
效果图
- 用户注册页面--ajax.php.js.css
- php用户注册页面利用js进行表单验证
- PHP+Ajax实现用户注册的界面
- 注册用户添加Js和Ajax验证
- php用户注册页面使用js进行表单验证具体实例
- JavaScript、CSS、HTML 实现用户注册页面与信息校验
- 一个简单的注册登录页面（包括阿里大于的手机验证）html+JS+AJAX+PHP
- 基于ajax+php+mysql数据库实现用户注册登录
- 采集页面的图片PHP+js+ajax
- Ajax+SpringMVC+Spring+Mybatis+MySql+js用户注册实例
- Ajax+SpringMVC+Spring+Mybatis+MySql+js用户注册实例
- Ajax+SpringMVC+Spring+Mybatis+MySql+js用户注册实例
- Ajax+SpringMVC+Spring+Mybatis+MySql+js用户注册实例
- Ajax+SpringMVC+Spring+Mybatis+MySql+js用户注册实例
- Ajax+SpringMVC+Spring+Mybatis+MySql+js用户注册实例
- ajax(用户注册)
- ajax用户注册
- ajax 注册事件 页面加载执行js事件
- ARM平台上蓝牙协议栈Bluez的移植使用和配置
- lfs下安装selinux需要重新安装的程序
- hover在IE8失效的问题
- JdbcUtil
- jndi.properties文件
- 用户注册页面--ajax.php.js.css
- velocity源码分析：velocity初始化
- 管理UNDO表空间
- JNI(Java Native Interface)在多线程中的运用 2
- 关于scoped_ptr的笔记
- 无限下拉列表
- Linux下通过端口杀死进程
- hdu 1086 很基本的计算几何
- 正则表达式入门经典（学习笔记二）——使用正则表达式的分析方法
