register.php

<html>

<head>

<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<title>用户注册</title>

<script type="text/javascript">

//创建ajax引擎

function getXmlHttpObject(){

	//不同的浏览器获取xmlhttprequest 的方法不一样

	if(window.ActiveXObject){

		//window.alert('ie');

		xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");

		}

	else{

		//window.alert('ff');

		xmlHttpRequest=new XMLHttpRequest();

		}

	return xmlHttpRequest;

}

var myXmlHttpRequest="";

function checkName(){

	myXmlHttpRequest=getXmlHttpObject();//1号线

	if(myXmlHttpRequest){

		//window.alert("创建Ajax引擎成功！");

		//通过myXmlHttpRequest对象发送请求到服务器的某一个页面

		//第一个参数表示请求的方式，get/post

		//第二个参数指定url，对那个页面发出ajax请求(本质仍然是http请求)，只要是web开发的底层是http请求，http的底层是tcp/ip协议

		//第三个参数 true 表使用异步机制，false表示不使用异步机制。

		//打开请求

		//var url="/ajax/registerPro.php?username="+$("username").value;

		//var url="/ajax/registerPro.php?mytime="+new date()+"&username="+$("username").value;

		var url="/ajax/registerPro.php";

		//这个是要发送数据

		var data="username="+$("username").value;

		//window.alert(url);

		myXmlHttpRequest.open("post",url,true);

		//这句话不可少

		//http_request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

		myXmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

		//指定回调函数 . chuli是函数名

		myXmlHttpRequest.onreadystatechange=chuli;

		//真的发送请求，如果是get请求发送null即可；如果是post请求，则填入实际的请求即可

		//myXmlHttpRequest.send(null); //2号线

		myXmlHttpRequest.send(data); //2号线

		}

}

//回调函数

function chuli(){

	//window.alert("回调函数成功!!"+xmlHttpRequest.readyState);

	//还是取值了

	if(xmlHttpRequest.readyState==4){

			//window.alert("服务器返回"+xmlHttpRequest.responseText);

			$("myres").value=xmlHttpRequest.responseText;

		}

}

//这里写一个函数

function $(id){

 	return document.getElementById(id);

 }

</script>

</head>

<body>

	<form action="" method="post">

			用户名字：<input type="text" onkeyup="checkName()" name="username1" id="username" />

			<input onclick="checkName();" type="button" value="验证用户名" /><input style="border-width:0px;color:red;" type="text" id="myres"/> <br />

			用户密码：<input type="password" name="password" /> <br />

			电子邮件：<input type="text" name="email" /> <br /> <input type="button" value="注册账号">

	</form>

</body>

</html> 

registerPro.php

$username = $_POST['username'];

// echo "用户名是：" . $username; // 3号线

if ($username == "zhosoft") {

	echo "此用户名不可用！";  // 注意，这里的数据是返回给请求的页面。

} else {

	echo "恭喜您，此用户名可用！";

}

AJAX实现无刷新验证用户名的更多相关文章

  1. 【转】 ASP.NET使用ICallbackEventHandler无刷新验证用户名是否可用

    功能说明:当用户在用户名输入框输入字符并焦点离开此输入框时,自动到数据库用户表中验证此用户名是否已被注册,如果已被注册,显示[不可用],反之,显示[可用],期间页面不刷新,读者也可以考虑将提示文字换成 ...

  2. Ajax实现注册无刷新验证用户名是否存在

    1. [代码][JavaScript]代码     ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 ...

  3. jsp+ajax实现无刷新

    jsp+ajax实现无刷新,鼠标离开文本框即验证用户名 jsp+ajax实现无刷新,鼠标离开文本框即验证用户名(本功能多用于注册) input.jsp(表单提交页面): %@ page content ...

  4. 使用ajax实现无刷新改变页面内容

    如何使用ajax实现无刷新改变页面内容(也就是ajax异步请求刷新页面),下面通过一个小demo说明一下,前端页面代码如下所示 1 <%@ Page Language="C#" ...

  5. window.history.pushState与ajax实现无刷新更新页面url

    ajax能无刷新更新数据,但是不能更新url HTML5的新API: window.history.pushState, window.history.replaceState 用户操作history ...

  6. Ajax 实现无刷新分页

    Ajax 实现无刷新分页

  7. Ajax 实现无刷新页面

    注意:如本文所用,在前面的文章库的数目可以在源代码中找到,我将指示在文本,其中链路,为了缩短制品的长度,阅读由此带来的不便.乞求被原谅. 评论文章 Ajax 实现无刷新页面.其原理.代码库.代码. 这 ...

  8. PHP+Ajax+plupload无刷新上传头像代码

    很简单的一款PHP+Ajax+plupload无刷新上传头像代码,兼容性很好,可以直接拿来用.你可以自定义各种类型的文件.本实例中只能上传"jpg", "png" ...

  9. jQuery+php+ajax实现无刷新上传文件功能

    jQuery+php+ajax实现无刷新上传文件功能,还带有上传进度条动画效果,支持图片.视频等大文件上传. js代码 <script type='text/javascript' src='j ...

随机推荐

  1. ASP.NET MVC企业级项目框架

    ASP.NET MVC企业级项目框架 MVC项目搭建笔记---- 项目框架采用ASP.NET MVC+Entity Framwork+Spring.Net等技术搭建,搭建过程内容比较多,结合了抽象工厂 ...

  2. Web应用程序整体测试基础——单元测试

    近年来,随着基于B/S结构的大型应用越来越多,Web应用程序测试问题也在逐步完善中.但Web应用程序测试既可以在系统开发中实施,也可以独立于系统单独完成,这取决于Web应用程序的复杂性和多样性.同时程 ...

  3. 使用OpenWrt的SDK

    原文:http://wiki.openwrt.org/doc/howto/obtain.firmware.sdk 为什么要使用SDK: Reasons for using the SDK are: C ...

  4. CSS知识点：清除浮动

    开场白 我们平时工作中,很容易遇到浮动效果.一个DIV中嵌套多个DIV,左边显示一个DIV,右边显示一个DIV,外层DIV的高度随着内层内容的高度变化.这就是最基本的浮动效果.下图的百度搜索结果就是一 ...

  5. ZA7783：MIPI转LVDS/MIPI转RGB888/RGB转LVDS

    在消费类电子越来越白热化阶段.好多设计project师已经開始慢慢关注到成本控制,小金在这里就给大家带来一颗转接IC.希望能帮助贵公司控制成本.当然性能也是可靠的,已经好多产品设计了. 多多不吝赐教 ...

  6. ODBC操作excel

    //ODBC连接Excel public static void main(String[] args) {  Connection conn = null;  Statement stm = nul ...

  7. [转]JSON and Microsoft Technologies（翻译）

    本文翻译CodeProject(链接)上的一篇文章,文章对JSON的概念以及它在微软一些技术中的应用起到了非常好的扫盲作用,总结得非常好,适合初学者. 目录 介绍 什么是JavaScript对象? 实 ...

  8. 数据结构二叉树的java实现，包括二叉树的创建、搜索、删除和遍历

    根据自己的学习体会并参考了一些网上的资料,以java写出了二叉树的创建.搜索.删除和遍历等操作,尚未实现的功能有:根据先序和中序遍历,得到后序遍历以及根据后序和中序遍历,得到先序遍历,以及获取栈的深度 ...

  9. DbUtility Ex

    扩展 DbUtility (1) 2014-05-22 21:48 by Ivony..., 234 阅读, 3 评论, 收藏, 编辑 本文原始路径: https://www.zybuluo.com/ ...

  10. python包

    有个伟人说过: python的学习很大一部分取决与你对第三方包的熟悉和掌握程度! virtualenv virtualenv用于创建独立的Python环境,多个Python相互独立,互不影响,它能够: ...