<!DOCTYPE html>
<html>
<head>
<title>用户注册</title>
<meta charset="utf-8">
<script language="javascript" type="text/javascript" >
//创建ajax引擎
function getXmlHttpObject(){ var xmlHttpRequest;
//不同浏览器获取xmlHttpRequest对象方法不一样
if(window.ActiveXObject){
//window.alert("ie");
xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");
}else{
//window.alert("no ie");
xmlHttpRequest=new XMLHttpRequest();
}
return xmlHttpRequest;
} var myXmlHttpRequest="";
//验证用户名是否存在
function checkName(){ myXmlHttpRequest=getXmlHttpObject();
//怎么判断创建ok
if(myXmlHttpRequest){
//window.alert("创建成功");
//通过myXmlHttpRequest对象发送请求到服务器的某个页面
//第一个参数表示请求的方式,"get"/"post"
//第二个参数指定url,对哪个页面发出ajax请求(本质仍然是http请求)
//第三个参数表示true 表示使用异步机制,如果false表示不使用异步
//var url="/registerProcess.php?username="+new Date()+$("username").value;
/*var url="/registerProcess.php?mytime="+new Date()+"&username="+$("username").value;*/
var url="/registerProcess.php";
//这个是要发送的数据
var data="username="+$("username").value;
//打开请求,准备发送,,true表示同步处理
myXmlHttpRequest.open("post", url, true);
//还有一句话,这句话必须
//在编程过程中,建议用Post,post会更好一些
myXmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//指定回调函数.chuli是函数名
myXmlHttpRequest.onreadystatechange=chuli; //真的发送请求,如果是get请求则填入 null即可
//如果是post请求,则填入实际的数据
myXmlHttpRequest.send(data);
//状态改变的触发器
//myXmlHttpRequest.open("get");
}else{
//window.alert("创建失败");
} } //回调函数
function chuli(){
//window.alert("处理函数被调回"+myXmlHttpRequest.readyState);
//我要取出从regiseterPro.php页面返回的数据
if(myXmlHttpRequest.readyState==4){
//取出值,根据返回信息的格式定.text
//window.alert("服务器返回"+myXmlHttpRequest.responseText);
//$("myres").value=myXmlHttpRequest.responseText;
//看看如何取出xml格式数据
//window.alert(myXmlHttpRequest.responseXML);
//获取mes节点
var mes=myXmlHttpRequest.responseXML.getElementsByTagName("mes");
//取出mes节点值
//window.alert(mes.length);
//mes[0]->表示取出第一个mes节点
//mes[0].childNodes[0]->表示第一个mes节点的第一个子节点
var mes_val=mes[0].childNodes[0].nodeValue;
//window.alert(mes_val);
$("myres").value=mes_val;
}
} function $(id){
return document.getElementById(id);
} </script>
</head>
<body>
<form > 用户名字<input type="text" name="username1" id="username" /><input type="button" value="验证用户名" onclick="checkName()"/>
<input type="text" style="border-width:0;color:red" id="myres"/>
<br/>
用户密码<input type="password" name="password" id="password"/><br/>
电子邮件<input type="text" name="email" id="email"/><br/>
<input type="submit" value="用户注册"/><br/><br/> 用户名字<input type="text" name="username1" />
<input type="text" style="border-width:0;color:red"/>
<br/>
用户密码<input type="password" name="password"/><br/>
电子邮件<input type="text" name="email"/><br/>
<input type="button" value="用户注册"/> </form>
</body> </html>

服务器端代码

<?php 

    //这里两句话很重要,第一句话告诉浏览器返回的数据是xml格式
header("Content-type: text/xml; charset=utf-8");
//如果这里写成Content-type: text/html,会报错,得不到数据
//告诉浏览器不要缓存数据
header("Cache-Control:no-cache");
//接收数据(这里要和请求方式对应 _POST 还是 _GET
$username=$_POST['username']; $info="";
if($username=="shunping"){
$info.="<res><mes>用户名不可以用,对不起</mes></res>";//注意,这里数据是返回给请求的页面
}else if($username!=""){
$info.="<res><mes>用户名可以用,恭喜</mes></res>";
}
echo $info; ?>

最新文章

  1. VS2013 配置pthread
  2. 记一次VNC远程连接Linux问题解决记录(5900端口测试、KDE桌面安装)
  3. Python 2.7.9 Demo - JSON的编码、解码
  4. Knockout.js, Asp.Net MVC and Bootstrap 前端设计
  5. dom4j修改,获取,增加xml中某个元素的属性值
  6. Esper系列(十)NamedWindow语法delete、Select+Delete、Update
  7. 模拟dispatch_once
  8. Hadoop认知--在不同的阶段
  9. ReactiveCocoa 浅析
  10. CSS3动画效果——js调用css动画属性并回调处理详解
  11. 自学WPF之Binding(二)
  12. PHP+MySQL分页原理实现
  13. webpack中插件 prerender-spa-plugin 来进行SEO优化(二十四)
  14. Golang 入门系列(六)理解Go中的协程(Goroutine)
  15. Spring MVC扩展
  16. java入门-day02
  17. spring cloud config git库文件搜索顺序
  18. Java就业班day09_xml&amp;tomcat
  19. Outlook Error: The Delegates settings were not saved correctly. Cannot activate send-on-behalf-of list.
  20. 在Mysql中查询两个时间段的差,可以是秒,天,星期,月份,年...

热门文章

  1. Quartz.Net - Lesson 1: 使用Quartz
  2. NPOI 添加下拉列表
  3. Cocoa 静态显示一个对话框
  4. sublime无法使用package Control解决办法。
  5. Mysql----MySQL的mysql_insert_id和LAST_INSERT_ID(转)
  6. 自定义一个更好用的SwipeRefreshLayout(弹力拉伸效果详解)(转载)
  7. IOS启动页动画(uiview 淡入淡出效果 )2
  8. USB-HID鼠标、键盘通讯格式(转) 与本人实际测试结果
  9. 【BZOJ1226】[SDOI2009]学校食堂Dining 状压DP
  10. 【BZOJ2006】[NOI2010]超级钢琴 ST表+堆