您的位置:首页 > 其它

ajax 简单应用---用户名无刷新验证

2013-05-17 16:58 260 查看
页面部分代码:

<!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" />
</head>
<body>
<form action="2.php" method="post">
<ul>
<li>用户名<input type="text" value="" name="uname" id="uname" /><span id="msg">(*)2-16位数字、字母</span></li>
<li>密码<input type="password" value="" name="upwd" id="upwd" /></li>
<li><input type="submit" value="注册" /></li>
</ul>
</form>
<script type="text/javascript">
/*======================================================
*1: 创建XMLHttpRequest 对象;[ajax 引擎]
*2: 准备好发送请求url地址与参数;
*3: 定义处理返回结果的方法
*4  打开
*5: 发送请求
*6: 接收服务器返回结果...
*7: 判断状态  XMLHttpRequest  {接收完成}
*8: 判断状态  http           {数据正确}
*9: 接收返回结果            {xml/text二种方式}
*10: 显示
*///====================================================

var http; //全局变量
//AJAX验证用户名是否存在
window.onload = function(){
var u = document.getElementById("uname");
u.onblur = function(){

//1:创建对象AJAX引擎
if(window.XMLHttpRequest){
//FF   IE8  IE9 -->OK
http =  new XMLHttpRequest();
}else{
//IE 6  --->OK
http = new ActiveXObject('Microsoft.XMLHTTP');
}
//url
var uname = document.getElementById("uname").value;
var url = "2.php?uname="+uname;
//alert(url);
//定义回调方法
//result 函数名
//onreadystatechange 指定当readyState属性改变时的事件处理句柄
http.onreadystatechange = result;
//打开 GET 传参数get -----------true 异步 false 同步
http.open("GET",url,true);
//发送   get 方式发送 就写 null
http.send(null);
};
//回调函数
function result(){
//4服务器发送数据结束
//200发送正确数据
if(http.readyState == 4
&& http.status === 200){ // status 返回当前请求的http状态码
}
var msg =document.getElementById("msg");
msg.innerHTML = http.responseText; //responseText 将响应信息作为字符串返回
}
};
</script>
</body>
</html>


程序数据库操作部分代码

<?php
function isExist($name){
$link = mysql_connect("localhost","root","");
mysql_select_db("zhibin");
mysql_query("set names utf8");
$sql = "select count(id) from t_user where name = '{$name}'";
$result = mysql_query($sql)or die(mysql_error());

if($row = mysql_fetch_array($result)){
if($row['0'] > 0){
return 1;
}else{
return 0;
}
}
return 0;
}

if(!empty($_GET['uname'])){  //??为什么是get不是post---->>前一个页面43行 url用的是GET方式
$rs = intval(isExist($_GET['uname']));
if($rs == 1){
echo "用户己存在";
}else{
echo "欢迎使用";
}
}
//  var_dump(isExist('当当1'));
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: