简明现代魔法 -> Ajax技术 -> Ajax 用户注册模块

Ajax 用户注册模块

2010-01-20

  1. reg2.php
  2. from_ck.js
  3. user_ck.php
  4. conn.php
  5. style.css

效果演示

Ajax用户注册验证


用户名: *
email: *
密码: *
密码强度:
确认密码: *
MSN:
QQ:
办公电话:
家庭电话:
手机:

reg2.php

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Ajax用户注册验</title>
<link href="style.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/javascript" src="from_ck.js"></script>
</head>
<body>
<div id="reg">
<h1>Ajax用户注册验证</h1>
<FORM name="formUser" onSubmit="return register();" action=user.php 
method=post>
  <BR>
  <TABLE width="100%" align=center border=0>
    <TBODY>
      <TR>
        <TD align=right width="15%"><STRONG>用户名:</STRONG></TD>
        <TD width="57%"><INPUT id="username" onBlur="chkUserName(this)" 
      name="username">
            <SPAN id="username_notice" >*</SPAN></TD>
      </TR>
      <TR>
        <TD align=right><STRONG>email:</STRONG></TD>
        <TD><INPUT id="email" onBlur="checkEmail(this)" name="email">
            <SPAN id=email_notice >*</SPAN></TD>
      </TR>
      <TR>
        <TD align=right><STRONG>密码:</STRONG></TD>
        <TD><INPUT id="password" onBlur="check_password(this)" 
      onkeyup="checkIntensity(this.value)" type="password" name="password">
            <SPAN 
      id=password_notice >*</SPAN></TD>
      </TR>
      <TR>
        <TD align=right><STRONG>密码强度:</STRONG></TD>
        <TD><TABLE cellSpacing=0 cellPadding=1 width=145 border=0>
          <TBODY>
            <TR align=middle>
              <TD id=pwd_lower width="33%">弱</TD>
              <TD id=pwd_middle width="33%">中</TD>
              <TD id=pwd_high width="33%">强</TD>
            </TR>
          </TBODY>
        </TABLE></TD>
      </TR>
      <TR>
        <TD align=right><STRONG>确认密码:</STRONG></TD>
        <TD><INPUT id="conform_password" onBlur="check_conform_password(this)" 
      type="password" name="confirm_password">
            <SPAN id=conform_password_notice >*</SPAN></TD>
      </TR>
      <TR>
        <TD align=right><STRONG>MSN:</STRONG></TD>
        <TD><INPUT name=other[msn]>        </TD>
      </TR>
      <TR>
        <TD align=right><STRONG>QQ:</STRONG></TD>
        <TD><INPUT name=other[qq]>        </TD>
      </TR>
      <TR>
        <TD align=right><STRONG>办公电话:</STRONG></TD>
        <TD><INPUT name=other[office_phone]>        </TD>
      </TR>
      <TR>
        <TD align=right><STRONG>家庭电话:</STRONG></TD>
        <TD><INPUT name=other[home_phone]>        </TD>
      </TR>
      <TR>
        <TD align=right><STRONG>手机:</STRONG></TD>
        <TD><INPUT name=other[mobile_phone]>        </TD>
      </TR>
      <TR>
        <TD> </TD>
        <TD><LABEL>
          <INPUT type="checkbox" CHECKED value="1" name="agreement" 
          	onBlur="check_agreement(this)">
          <B>我已看过并接受《<a href="#">用户协议</a>》<SPAN id=agreement_notice >*</SPAN></B></LABEL></TD>
      </TR>
      <TR>
        <TD  ><INPUT type=hidden value=act_register name=act></TD>
        <TD  ><input type=submit value=确认注册    name="Submit1" class="anniu" disabled></TD>
      </TR>
      <TR>
        <TD colSpan=2> </TD>
      </TR>
    </TBODY>
  </TABLE>
</FORM>
</div>
</body>
</html>  

Top

from_ck.js

  

Top

user_ck.php

<?php
	include("conn.php");
	//设置页面编码
	header("Content-type:text/html;charset=UTF-8");
	$username=trim($_GET["username"]);
	$conn=mysql_open();
	$sql="select * from snow_user where u_user='$username'";
	$query=mysql_query($sql);
	$rst=mysql_fetch_object($query);
	mysql_close($conn);
	if ($rst==false)
	{
		echo 'false';
	}
	else
	{
		echo 'true';
	}
?>  

Top

conn.php

<?php
function mysql_open()
{
	$mysql_servername="221.231.138.112"; //服务器名称
	$mysql_username="ch3ch2";
	$mysql_password="123456";
	$mysql_dbname="ch3ch2";

	$conn=mysql_connect($mysql_servername ,$mysql_username ,$mysql_password);
 
	mysql_select_db($mysql_dbname , $conn);
	return $conn;
}
?>  

Top

style.css

BODY {
	FONT: 12px , Arial, Helvetica, sans-serif; COLOR: #808080
}
#reg{
	width: 600px;
	border: 1px dotted #336699;
}
td{font-size:12px;color:}
h1{
	height:35px;
	font-size:16px;
	color:#FFFFFF;
	background-color: #336699;
	line-height: 30px;
	padding-left:25px;
}

.anniu {
	BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: #ffffff 1px solid; PADDING-LEFT: 1px; FONT-SIZE: 9pt; PADDING-BOTTOM: 1px; BORDER-LEFT: #ffffff 1px solid; CURSOR: hand; COLOR: #333333; PADDING-TOP: 1px; BORDER-BOTTOM: #666666 1px solid; FONT-FAMILY: "宋体"; HEIGHT: 20px; BACKGROUND-COLOR: #eeeeee
}
.FrameDivPass{
	
	border: 1px solid #6FBE44;
	padding: 2px;
	height: 100%;
	float: left;
}
.FrameDivWarn{
	
	border: 1px solid #FF0000;
	padding: 2px;
	height: 100%;
	float: left;
}  

Top

下载源代码

随机文章推荐
网站分类


注:如需转载本文,请注明出处(原文链接),谢谢。更多精彩内容,请进入简明现代魔法首页。

进入新博客
喜欢本文,就分享它吧
给我留言
您的名字:
您的邮件:
您的网站:


 

copyright © 2009 简明现代魔法    学习、分享、进步

power by Gonn 感谢所有关心和支持本站的朋友们