php和ajax的检测账号功能

最新推荐文章于 2024-09-22 21:46:54 发布

G450955991

最新推荐文章于 2024-09-22 21:46:54 发布

阅读量780

点赞数

分类专栏：我学PHP和Ajax的列子文章标签： ajax php 数据库 character xmlhttprequest border

本文链接：https://blog.csdn.net/g450955991/article/details/3127632

版权

我学PHP和Ajax的列子专栏收录该内容

0 篇文章 0 订阅

订阅专栏

=====================================创建数据库==============================

数据库 (ajaxdb)

表名 message:mid(int(11) 非空自动递增主键信息的ID) mtitle(varchar(255) 非空信息的标题) mcontent(text 非空内容) mdate(datetime 非空日期) muid(int(11) 非空点击数)

表名 users:uid(int(11) 非空自动递增主键用户的ID) uaccount(varchar(50) 非空用户的账号) upwd(varchar(50) 非空密码) uemail(varchar(50) 非空邮箱) uname(varchar 非空用户的真实名字) udate(datetime 非空日期)

==================================注册的div页面 ==========================================

<!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" />
<title>ajax信息展示</title>
<link href="css/web.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript" src="js/ajax.js"></script>
</head>

<body>
<div id="wrapper">
<div id="header">
  <div id="usernav"><a href="#">购物车</a><a href="#">登录</a><a href="#">注册</a></div>
  <div id="nav">
   <ul>
      <li ><a href="#" class="cur">首页</a></li>
      <li><a href="#">产品</a></li>
      <li><a href="#">公司新闻</a></li>
      <li><a href="#">联系我们</a></li>
      <li><a href="#">招聘</a></li>
   </ul>
  </div>
</div>
<div id="main">
  <div id="register">
   <h2>Ajax注册</h2>
   <form>
   <fieldset><legend>基本资料</legend>
   <ul>
     <li><label>*用户名：</label><input name="uaccount" id="uaccount" type="text" οnblur="checkAccount(this)"/><span id="tip_uaccount"></span></li>
     <li><label>*密码：</label><input name="upwd" id="upwd" type="password" /><span></span></li>
     <li><label>*密码确认：</label><input name="urepwd" id="urepwd" type="password" /><span></span></li>
     <li><label>Emal：</label><input name="uemail" id="uemail" type="text" /><span></span></li>
<li><label>姓名：</label><input name="uname" id="uname" type="text" /><span></span></li>

   </ul>
   </fieldset>
   <fieldset><legend>提交资料</legend>
   <p><input name="" type="button" value="注册" class="bt" οnclick="register()"/></p>
   </fieldset>
   </form>
  </div>
</div>

<div id="bottom">世界之树--计算机信息专业</div>
</div>
</body>
</html>

=====================================注册css代码=======================

/* CSS Document */
*{ margin:0; padding:0;}
body{ background:url(../images/pagebg.jpg) fixed; font-size:12px; text-align:center;}
a{ color:#FFCC33; text-decoration:none;}
a:hover{ color:#666666; text-decoration:underline;}
#wrapper{ width:771px; margin:10px auto; }
#main{background-color:#fff;filter:alpha(opacity=80);-moz-opacity:0.80;opacity:0.80; border:1px dotted #313131;float:left; width:771px; margin-bottom:20px; padding-bottom:50px;}
#bottom{ clear:both; height:100px; line-height:100px; color:#fff; font-weight:600;}

/* header CSS */
#header{ background:url(../images/logo.gif) no-repeat left top; height:170px; position:relative;}
#usernav{ text-align:right; padding:20px;}
#usernav a{ color:#FFFFFF; margin:10px;}
#nav{ background:url(../images/navbg.gif) no-repeat right top; position:absolute; right:0px; top:105px; height:83px; width:568px;}
#nav ul{ list-style:none; padding-left:12px; padding-top:3px;}
#nav ul li{ float: left; }
#nav ul li a{ width:111px; height:75px; line-height:46px; background:url(../images/navbtbg1.gif) no-repeat; display:block; text-decoration:none; color:#999900; font-weight:600;}
#nav ul li a:hover,#nav ul li .cur{background:url(../images/navbtbg2.gif) no-repeat -2px 0px; color:#0000CC; font-weight:600; padding-top:30px;height:45px;}

/* main css */
#content,#register{width:500px;margin:30px auto; position:relative; background-color:#FFFFFF; padding:20px 10px;}
#content h2,#register h2{ font-size:18px; font-family:"幼圆"; text-align:left; padding-left:30px; font-weight:500; height:30px; line-height:30px; border-bottom:3px double #CC6600; margin-bottom:20px;}
#content ul{ padding:10px 20px;}
#content ul li{border-bottom:1px dotted #666; text-align:left; padding:20px 10px; cursor:pointer; list-style-position:inside; margin-bottom:5px;color:#0099FF; position:relative;}
#content ul li span{ margin-right:10px; font-weight:600; color:#666666}
#content ul li .message{ position:absolute; left:200px; bottom:0; background-color:#CCCCCC; width:400px; padding:0; margin:0;}
#content ul li .message .mcontent{ border:1px solid black; position:relative; left:-5px; top:-5px; background-color:#FFFFFF; padding:20px; line-height:20px; text-indent:2em; color:#333333;}

#register fieldset{ padding:20px; margin:10px;}
#register ul{ padding-left:50px; color:#666666; margin-top:10px;}
#register ul li{ clear:both; height:20px; line-height:20px; list-style:none; margin-bottom:10px;}
#register ul li label{ display:block; width:100px; float:left; text-align:right; margin-right:10px;}
#register ul li input{ float:left; width:120px; border:1px solid #333; height:20px; line-height:20px;}
#register ul li span{ display:block; float:left; margin-left:10px; color:#FF0000}
#register .bt{ border:1px solid #ccc; background-color:#6699FF; color:#FFFFFF; padding:3px 15px; cursor:pointer; margin-top:10px;}

========================================创建连接数据库的connect.php件==========

<?php

if(!mysql_connect("localhost","root","")) //第一个参数是主机名,第二个是账号,第三个是密码没有

{

exit('连接数据库失败!'); //失败就不执行下一条语句

}

if(!mysql_select_db("ajaxdb")) //选择数据库的名字

{

exit('选择数据库失败');

}

mysql_query("SET character_set_connection=gb2312,character_set_results=gb2312,character_set_client=gb2312");//消除连接数据库乱码转化为gb2312

==============================创建注册客户端页面javascript(ajax.js)文件(异步功能)================

//JavaScript Document

function createXmlHttpRequest()

{

var xmlHttp; //声明xmlHttp

try //测试

{

xmlHttp=new XMLHttpRequest(); //生成新的异步请求

}

catch(e) //失败之后的处理

{

try

{

xmlHttp=new ActiveXObject("Microsoft.XMLHttp"); //生成新的旧时的异步请求

}

catch(e){}

}

if(!xmlHttp) alert("创建XMLhttpRequese失败");//假如生成异步请求失败..弹出对话框

else

return xmlHttp;//返回成功的请求xmlHttp

}

function g(elementid) //生成读取ID的函数

{
return document.getElementById(elementid);
}

检测账号

var xmlHttp1=createXmlHttpRequest(); //调用异步请求函数

function checkAccount(account)

{

if(account!==) //账号不等于空

{

var url="message.php?type=checkaccount&account="+account.values; //声名一个路径并传递一个账号的值

xmlHttp1.open('get',url,true);//异步请求函数的打开方法(传送方式,路径,true是异步 flase是同步)

xmlHttp1.onreadystatechange=handleCheckAccount;//接受并处理服务端的数据 handleCheckAccount是一个函数用来接受服务端的数据

xmlHttp1.send(null);//发送到客户端

}

function handleCheckAccount()

{

if(xmlHttp1.readyState==4) //成功为4

{

if(xmlHttp1.status==200) //状态文件为200

{

if(xmlHttp1.responseText=='ok') //在服务端获取的数据是'ok'的话

g('tip_uaccount').innerHTML='该用户名可以使用'; //在html的span输出"该用户名可以使用"

else if(xmlHttp1.responseText=='no') //在服务端获取的数据是'on'的话

g('tip_uaccount').innerHTML='该用户名已经有人使用';

else

alert('请求失败;'+xmlHttp1.responseText);//什么都不是的话就弹出对话框显示错误

}

/End 检测账号///

===========================服务端的检测message.php============

<?php

header("Content-Type:text/html; charset=gb2312");//转化为gb2312

require_once("connect.php");//导入数据库连接文件

$type=$GET['type'];//接受过来的类型

if($type=='checkaccount')//接受过来的类型是checkaccount的话

{

$uaccount=$_GET['account']; //把账号附给变量

if(checkAccount($uaccount)) //用checkAccount函数检测

echo'no';//输出有人使用

else

echo'ok';//输出没有人使用

}

function checkAccount($uaccount){
$selectSQL="select count(*) from users where uaccount='$uaccount'"; //SQL语句检查有多少条纪录
$result=mysql_query($selectSQL);//执行数据语言
list($num)=mysql_fetch_row($result);//在用mysql_fetch_row函数获取一行的数据并把一个个数据附给list数组中变量$num中
if($num>0)//假如数组$num变量是大于0的话
return true;
else
return false;
}