本文实例讲述了php+Ajax无刷新验证用户名操作。分享给大家供大家参考,具体如下:

AJAX 简介

AJAX = Asynchronous JavaScript And XML(异步 JavaScript 及 XML)AJAX 是 Asynchronous JavaScript And XML 的首字母缩写。AJAX 并不是一种新的编程语言,而仅仅是一种新的技术,它可以创建更好、更快且交互性更强的 web 应用程序。AJAX 使用 JavaScript 在 web 浏览器与 web 服务器之间来发送和接收数据。通过在幕后与 web 服务器交换数据,而不是每当用户作出改变时重载整个 web 页面,AJAX 技术可以使网页更迅速地响应

Ajax请求

传统的 web 应用程序会把数据提交到 web 服务器(使用 HTML 表单)。在 web 服务器把数据处理完毕之后,会向用户返回一张完整的新网页。由于每当用户提交输入,服务器就会返回新网页,传统的 web 应用程序往往运行缓慢,且越来越不友好。通过 AJAX,web 应用程序无需重载网页,就可以发送并取回数据。完成这项工作,需要通过向服务器发送 HTTP 请求(在幕后),并通过当服务器返回数据时使用 JavaScript 仅仅修改网页的某部分。一般使用 XML 作为接收服务器数据的格式,尽管可以使用任何格式,包括纯文本。

无刷验证新用户名

自己最近看视频自学ajax,想把一些实例分享给大家,第一个案列是无刷新验证用户名是否可用。

一、效果图

1、用户可用

2、用户不可用

3、项目文件(register.php-注册页面 和process.php-判断用户名是否可用)

二、代码

register.php-注册页面以及ajax发送请求

<!doctypehtml><htmllang="en"><head>  <meta charset="UTF-8">  <title>注册</title>  <scripttype="text/javascript">    //创建ajax引擎    function getXmlHttpObject(){      var xmlHttpRequest;      //不同浏览器获取对象XMLHttpRequest      if(window.ActiveXObject){        xmlHttpRequest=newActiveXObject("Microsoft.XMLHTTP");      }      else{        xmlHttpRequest=newXMLHttpRequest();      }      return xmlHttpRequest;    }    var myXmlHttpRequest="";    //验证用户名是否存在    function checkName(){      myXmlHttpRequest=getXmlHttpObject();      //判断xmlHttpRequest是否成功      if(myXmlHttpRequest){        //通过myXmlHttpRequest对象发送请求到服务器的某个页面        //第一个参数标示请求的方式,‘get"、‘post"        //第二个参数指定url,对那个页面发送ajax请求(本质仍然是http请求)        /*XMLHttpRequest.open(bstrMethod, bstrUrl, varAsync, bstrUser,bstrPassword);         */        varurl="/Ajax/process.php?username="+$("username").value;        //window.alert(url);        myXmlHttpRequest.open("get",url,true);        //window.alert("创建ajax引擎成功");        //指定回调函数,chuili是函数名        myXmlHttpRequest.onreadystatechange=chuli;//调用        //真的发送请求,如果是各塔请求则填入null即可        //如果是post请求,则填入实际数据        myXmlHttpRequest.send(null);      }      else      {//        window.alert("创建失败");      }    }    function chuli(){      // window.alert("cuhli函数被调用"+myXmlHttpRequest.readyState);      //我要取出从register.php返回的数据      if(myXmlHttpRequest.readyState==4){        //取出值,根据返回信息的数据格式        //window.alert("服务器返回"+myXmlHttpRequest.responseText);        $("myres").value=myXmlHttpRequest.responseText;      }    }    function $(id){      return document.getElementById(id);    }  </script></head><body><formaction="???" method="post">  用户名字:<inputtype="text" name="username1"onkeyup="checkName()" id="username">  <input type="button"value="验证用户名">  <input style="border-width:0;color: #e93b3d" type="text" id="myres">  <br/>  用户密码:<inputtype="password" name="password"><br>  电子邮件:<inputtype="text" name="email"><br/>  <input type="submit"value="用户注册"></form></body></html>

process.php—判断用户名是否可用

<?php  //接受数据  $username=$_GET["username"];//  echo "用户名".$username;  if($username=="李四"){    echo "用户名不可用";  }  else{    echo"恭喜用户名可用";  }?>

三、原理图

更多关于PHP相关内容感兴趣的读者可查看本站专题:《PHP+ajax技巧与应用小结》、《PHP网络编程技巧总结》、《PHP基本语法入门教程》、《php面向对象程序设计入门教程》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总》

希望本文所述对大家PHP程序设计有所帮助。