php+Ajax无刷新验证用户名操作实例详解


Posted in PHP onMarch 04, 2019

本文实例讲述了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、用户可用

php+Ajax无刷新验证用户名操作实例详解

2、用户不可用

php+Ajax无刷新验证用户名操作实例详解

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

php+Ajax无刷新验证用户名操作实例详解

二、代码

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+Ajax无刷新验证用户名操作实例详解

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

PHP 相关文章推荐
Php注入点构造代码
Jun 14 PHP
php 前一天或后一天的日期
Jun 28 PHP
解析PHP中DIRECTORY_SEPARATOR,PATH_SEPARATOR两个常量的作用
Jun 21 PHP
Thinkphp的volist标签嵌套循环使用教程
Jul 08 PHP
PHP实现的线索二叉树及二叉树遍历方法详解
Apr 25 PHP
PHP QRCODE生成彩色二维码的方法
May 19 PHP
thinkphp3.x中display方法及show方法的用法实例
May 19 PHP
PHP书写格式详解(必看)
May 23 PHP
功能强大的php分页函数
Jul 20 PHP
php实现购物车产品删除功能(2)
Jul 23 PHP
在Laravel5.6中使用Swoole的协程数据库查询
Jun 15 PHP
Laravel使用scout集成elasticsearch做全文搜索的实现方法
Nov 30 PHP
实例介绍PHP删除数组中的重复元素
Mar 03 #PHP
PHP+Ajax简单get验证操作示例
Mar 02 #PHP
PHP结合jquery ajax实现上传多张图片,并限制图片大小操作示例
Mar 01 #PHP
PHP实现获取毫秒时间戳的方法【使用microtime()函数】
Mar 01 #PHP
PHP中“=&gt;
Mar 01 #PHP
PHP htmlspecialchars_decode()函数用法讲解
Mar 01 #PHP
PHP递归的三种常用方式
Feb 28 #PHP
You might like
php 计划任务 检测用户连接状态
2012/03/29 PHP
实测在class的function中include的文件中非php的global全局环境
2013/07/15 PHP
PHP中比较两个字符串找出第一个不同字符位置例子
2014/04/08 PHP
codeigniter中测试通过的分页类示例
2014/04/17 PHP
ThinkPHP后台首页index使用frameset时的注意事项分析
2014/08/22 PHP
PHP实现模仿socket请求返回页面的方法
2014/11/04 PHP
PHP批量去除BOM头代码分享
2015/06/26 PHP
php+html5+ajax实现上传图片的方法
2016/05/14 PHP
Jquery在IE7下无法使用 $.ajax解决方法
2009/11/11 Javascript
JQUERY 设置SELECT选中项代码
2014/02/07 Javascript
JavaScript仿静态分页实现方法
2015/08/04 Javascript
jQuery简单获取键盘事件的方法
2016/01/22 Javascript
不定义JQuery插件 不要说会JQuery
2016/03/07 Javascript
jQuery判断元素是否显示 是否隐藏的简单实现代码
2016/05/19 Javascript
Vue动态组件实例解析
2017/08/20 Javascript
Vue.js标签页组件使用方法详解
2019/10/19 Javascript
Vue中fragment.js使用方法小结
2020/02/17 Javascript
python生成随机验证码(中文验证码)示例
2014/04/03 Python
使用python编写android截屏脚本双击运行即可
2014/07/21 Python
利用Python生成文件md5校验值函数的方法
2017/01/10 Python
python 读写excel文件操作示例【附源码下载】
2019/06/19 Python
Win10下Python3.7.3安装教程图解
2019/07/08 Python
python输出带颜色字体实例方法
2019/09/01 Python
python实现把两个二维array叠加成三维array示例
2019/11/29 Python
python使用requests库爬取拉勾网招聘信息的实现
2020/11/20 Python
AmazeUI 按钮交互的实现示例
2020/08/24 HTML / CSS
酒店行政人事部经理职务说明书
2014/02/26 职场文书
银行优秀员工事迹材料
2014/05/29 职场文书
新文化运动的基本口号
2014/06/21 职场文书
小学生节水倡议书
2015/04/29 职场文书
综治目标管理责任书
2015/05/11 职场文书
假如给我三天光明读书笔记
2015/06/26 职场文书
手把手教你从零开始react+antd搭建项目
2021/06/03 Javascript
spring cloud gateway中如何读取请求参数
2021/07/15 Java/Android
Kubernetes部署实例并配置Deployment、网络映射、副本集
2022/04/01 Servers
Apache Kafka 分区重分配的实现原理解析
2022/07/15 Servers