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 相关文章推荐
玩转虚拟域名◎+ .
Oct 09 PHP
PHP的基本常识小结
Jul 05 PHP
php过滤html中的其他网站链接的方法(域名白名单功能)
Apr 24 PHP
ThinkPHP基于PHPExcel导入Excel文件的方法
Oct 15 PHP
php中get_object_vars()方法用法实例
Feb 08 PHP
PHP常用处理静态操作类
Apr 03 PHP
PHP利用APC模块实现大文件上传进度条的方法
Oct 29 PHP
php脚本守护进程原理与实现方法详解
Jul 20 PHP
PHP设计模式之原型模式定义与用法详解
Apr 03 PHP
PHP实现获取ip地址的5种方法,以及插入用户登录日志操作示例
Feb 28 PHP
TP5(thinkPHP框架)实现后台清除缓存功能示例
May 29 PHP
Laravel基础-关于引入公共文件的两种方式
Oct 18 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 中文处理函数集合
2008/08/27 PHP
PHP MSSQL 存储过程的方法
2008/12/24 PHP
PHP 用数组降低程序的时间复杂度
2009/12/04 PHP
PHP求小于1000的所有水仙花数的代码
2012/01/10 PHP
批量去除PHP文件中bom的PHP代码
2012/03/13 PHP
PHP实现的曲线统计图表示例
2016/11/10 PHP
jQuery 添加/移除CSS类实现代码
2010/02/11 Javascript
一次失败的jQuery优化尝试小结
2011/02/06 Javascript
写了10年的Javascript也未必全了解的连续赋值运算
2011/03/25 Javascript
jQuery中ready事件用法实例
2015/01/19 Javascript
jQuery获取元素父节点的方法
2016/06/21 Javascript
javascript 解决浏览器不支持的问题
2016/09/24 Javascript
微信小程序  简单实例(阅读器)的实例开发
2016/09/29 Javascript
vuejs响应用户事件(如点击事件)
2017/03/14 Javascript
JavaScript中0、空字符串、'0'是true还是false的知识点分享
2019/09/16 Javascript
使用axios请求接口,几种content-type的区别详解
2019/10/29 Javascript
Node 模块原理与用法详解
2020/05/13 Javascript
Ajax获取node服务器数据的完整步骤
2020/09/20 Javascript
python基于mysql实现的简单队列以及跨进程锁实例详解
2014/07/07 Python
Python实现包含min函数的栈
2016/04/29 Python
浅谈python中拼接路径os.path.join斜杠的问题
2018/10/23 Python
Django的ListView超详细用法(含分页paginate)
2020/05/21 Python
Win10下配置tensorflow-gpu的详细教程(无VS2015/2017)
2020/07/14 Python
Pycharm学生免费专业版安装教程的方法步骤
2020/09/24 Python
英国最大的女士服装零售商:Bonmarché
2017/08/17 全球购物
世界上最伟大的马产品:Equiderma
2020/01/07 全球购物
某公司的.net工程师面试题笔试题
2013/11/22 面试题
30年同学聚会感言
2014/01/30 职场文书
小学新学期寄语
2014/04/02 职场文书
幼儿园大班家长评语
2014/04/17 职场文书
小学生操行评语
2014/04/22 职场文书
新品发布会策划方案
2014/06/08 职场文书
交通事故赔偿起诉书
2015/05/20 职场文书
行政复议决定书
2015/06/24 职场文书
2016新春团拜会致辞
2015/08/01 职场文书
浅析Python中的套接字编程
2021/06/22 Python