介绍 & lt; ! DOCTYPE html>
& lt; html>
,& lt; head>
& lt;才能meta charset=皍tf-8",/比;
ajax & lt;才能title>无刷新检测& lt;/title>
& lt;才能style 类型=拔谋?css"比;
身体,,{保证金:0;填充:0;}.content{宽度:800 px;保证金:0,汽车;}ul、李{list-style:没有;保证金:0;填充:0;}
,,tr{宽度:200 px;} td{宽度:80 px;填充:5 px 0;} td 输入,文本区域{边界:1 px solid # 79 abfe;},
& lt;才能/style>
,& lt;/head>
,& lt; body>
& lt;才能div 类=癱ontent"比;
,,& lt; script>
,,,myXmlHttpRequest.ContentType=(“text/xml; charset=UTF-8");
,,,//创建ajax引擎(1号线)
,,,function getXmlHttpObject () {,,
,,,,var xmlHttpRequest;
,,,,//不同浏览器获取对象xmlHttpRequest方法不一样
,,,,如果(window.ActiveXObject) {
,,,,,xmlHttpRequest=new ActiveXObject (“Microsoft.XMLHTTP");
,,,,其他}{
,,,,,xmlHttpRequest=new xmlHttpRequest ();
,,,,}
,,,,return xmlHttpRequest;
,,,}
,,,//验证用户名是否存在
,,,var myXmlHttpRequest=啊?/因为chuli也用到了,所以要定义为全局变量,
,,,//创建方法(2号线,http请求)
,,,function checkName () {
,,,,//创建对象,
,,,,myXmlHttpRequest=getXmlHttpObject ();
,,,,//判断是否创建好
,,,,如果(myXmlHttpRequest) {
,,,,,//通过myXmlHttpRequest对象发送请求到服务器的某个页面,
,,,,,var url=啊?registerPro1.php";
,,,,,//要发送的数据
,,,,,var 数据=https://www.yisu.com/zixun/"用户名=" + $ value(“用户名”);//打开请求
myXmlHttpRequest.open(“文章”,url,真的);//真正的表示使用异步机制//发布方法
myXmlHttpRequest.setRequestHeader(“内容类型”,“应用程序/x-www-form-urlencoded”);//指定回调函数,chuli是函数名(registerPro里的数据返回给chuli函数)
myXmlHttpRequest.onreadystatechange=chuli;//开始发送数据,如果是得到请求则填入空即可,如果是帖子请求则填入实际的数据
myXmlHttpRequest.send(数据);
}
}//回调函数(4号线)
函数chuli () {//取出从registerPro.php页面返回的数据(4表示完成,200表示成功)
如果(myXmlHttpRequest.readyState==4) {
如果(myXmlHttpRequest.status==200) {//①,取出值,根据返回信息的格式定文本(html)//$('结果')value=myXmlHttpRequest.responseText;//②,取出xml格式数据(解析)//获取mes节点,这里的mes返回的是节点列表(不知道有几个mes)//var mes=myXmlHttpRequest.responseXML.getElementsByTagName (mes);//取出mes节点值//mes[0] ->表示取出第一个mes节点//mes [0] childnodes[0] ->表示取出mes节点的第一个子节点//var mes_val=mes [0] childnodes [0] .nodeValue;//$(“结果”)value=mes_val;//③、json格式//var mes=myXmlHttpRequest.responseText;//使用eval函数,将mes字串转为对象//var mes_obj=eval ((" + mes + "));//$('结果')value=mes_obj.res;//③+,json格式扩展
var mes=myXmlHttpRequest.responseText;
var mes_obj=eval ((" + mes + "));
$('结果')value=mes_obj [0] r;
}
}
}//封装一个函数,通过id号获取对象
函数$ (id) {
返回. getelementbyid (id);
}>
<>强发表留言
<形式action=" # "方法=癙OST”名称=芭┏ ?
<表格单元格边距=" 0 "单元格间距=" 0 ">
留言标题:
道明> 网名:
<输入id="用户名" onkeyup=" checkName (); " type=" text " name="用户名"自动完成="关闭"/>
<输入id="结果" type=" text ">
道明>
留言内容:
<输入类=癰tn”类型=疤峤弧泵?疤峤弧敝?疤峤?/>
这篇文章将为大家详细讲解有关AJAX如何实现无刷新检测用户名功能,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
先来看看原理图
注册。php