login.html
<!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=utf-8" /> <META HTTP-EQUIV="expires" CONTENT="0"> <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> <title>PHP+AJAX用户验证</title> <style type="text/css"> <!-- body{ text-align:center; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; background:#EFEFEF; } #login { margin-top:6%; margin-right:auto; margin-left:auto; line-height: 20px; color: #000000; width:300px; border:1px solid #336699; background:#FFF; } #frmlogin{ text-align:left; margin-left:8px; } h1{ margin:0px 0px 10px 0px; padding:0px; width:100%; height:30px; line-height:30px; color:#FFF; background:#336699; font-size:18px; text-align:left; text-indent:10px; font-weight:normal; font-family:Arial, Helvetica, sans-serif; } input{ border:1px solid #336699; height:14px; line-height:14px; width:120px; } .button{ padding-right:10px; padding-left:10px; height:22px; line-height:22px; background:#fbfbfb; color:#000; text-align:center; border-right:2px solid #999; border-left:2px solid #999; border-top:1px solid #999; border-bottom:1px solid #999; margin-right:5px; margin-left:5px; } label{ font-weight:bold; color:#336699; } #tip{ color:#ff9900; } --> </style> <script type="text/javascript"> <!-- //XMLHttpRequest var xmlhttp = false; function createXMLHttpRequest(){ if (window.XMLHttpRequest) { // Mozilla, Safari, ... xmlhttp = new XMLHttpRequest(); } else if (window.ActiveXObject) { // IE xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } } function Ajax(data){ createXMLHttpRequest(); xmlhttp.open("GET","db.php?username="+escape(document.getElementById("username").value),true); xmlhttp.send(null); xmlhttp.onreadystatechange=function(){ if (4==xmlhttp.readyState){ if (200==xmlhttp.status){ document.getElementById("tip").innerHTML=xmlhttp.responseText; }else{ alert("!"); } } } } function chkUserName(obj){ if(obj.value.length<1){ obj.style.backgroundColor="#efefef"; alert("不能为空!"); obj.focus(); }else{ //Ajax,??? Ajax(obj.value); } } //--> </script> </head> <body> <div id="login"> <h1>PHP+Ajax</h1> <form id="frmlogin" name="frmlogin"> <label>用户名: <input name="username" type="text" id="username" size="22" maxlength="10" onblur="chkUserName(this)" /> </label><label id="tip"></label> <p> <label>密 码: <input name="pwd" type="password" id="pwd" size="24" maxlength="16" /> </label> </p> <p align="center"> <input name="Submit" type="button" class="button" id="btn_login" style="width:60px;background:#efefef;height:25px;line-height:25px;font-size:12px;" value="提交" /> <input name="Submit2" type="reset" class="button" style="width:60px;background:#EFEFEF;height:25px;line-height:25px;font-size:12px;" value="重设" /> </p> </form> </div> </body> </html>
db.php
<?php /*数据库连接*/ ("数据库","名","密码"); mysql_query("SET NAMES UTF8"); mysql_select_db("test_4",$conn); //设置页面编码 header("Content-type:text/html;charset=UTF-8"); //查询数据库 if(isset($_GET["username"])){ $strsql="SELECT * FROM member WHERE username='".unescape($_GET["username"])."'"; $result=mysql_query($strsql); ); mysql_close($conn); //判断是否有此记录 if(!$rows){ echo "此用户名未被注册!"; }else{ echo "已被注册!"; } }else{ echo "别调戏我!"; } /*PHP的unescape转换函数,用来转换Javascript用escape函数加密过的字符 --此函数需要iconv函数库支持*/ function unescape($str) { $str = rawurldecode($str); preg_match_all("/%u.{4}|&#x.{4};|&#d+;|&#d+?|.+/U",$str,$r); $ar = $r[0]; foreach($ar as $k=>$v) { if(substr($v,0,2) == "%u") $ar[$k] = iconv("UCS-2","UTF-8",pack("H4",substr($v,-4))); elseif(substr($v,0,3) == "&#x") $ar[$k] = iconv("UCS-2","UTF-8",pack("H4",substr($v,3,-1))); elseif(substr($v,0,2) == "&#") { $ar[$k] = iconv("UCS-2","UTF-8",pack("n",preg_replace("/[^d]/","",$v))); } } return join("",$ar); } ?>