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. Yii2中如何使用CodeCeption

    Yii2和CodeCeption CodeCeption是一个全栈的PHP测试框架,关于CodeCeption的介绍见:CodeCeption官方文档. Yii2官方增加了对CodeCeption的支 ...

  2. selenium2入门 用Yaml文件进行元素管理 （五）

    比如界面有一个按钮,id号是test.如果进行对象化的话,就是test.click就可以了.不用每次都要去创建test对象.如果id号变了,我们也只需要改一下test的名称就行了. 使用Yaml需要用 ...

  3. 一个只能用在Win下的密码验证函数(显示星号，可删除)

    以前做小程序时图好玩在网上找的代码.输入的密码会以星号显示出来,并且输入错了可以删除.因为用了专有库函数,所以只能在Windows平台使用,少用为好,不过可能还有点用.嗯…就这样了 #include ...

  4. openwrt固件支持3G和4G上网卡

    http://wiki.openwrt.org/doc/howtobuild/wireless-router-with-a-3g-dongle Building image with support ...

  5. JavaScript后台代码操作HTML TABLE的方法

    原文:JavaScript后台代码操作HTML TABLE的方法 var rowNum = 0,fileNum = 0; //行号与列号 var oNewRow; //定义插入行对象 var oNew ...

  6. leetcode[159] Longest Substring with At Most Two Distinct Characters

    找到最多含有两个不同字符的子串的最长长度.例如:eoeabc,最长的是eoe为3,其他都为2. 思路: 用p1,p2表示两种字符串的最后一个出现的下标位置.初始p1为0. p2为-1.start初始化 ...

  7. mysql支持的数据类型及其测试

    原文:mysql支持的数据类型及其测试 1.基础知识 1.1如何来查看mysql的帮助手册 ?int Help float; 1.2创建表的规则 CREATE TABLE [IF NOT EXISTS ...

  8. JSON.stringify 方法

    浅谈 JSON.stringify 方法   用过 json 的应该都知道,把一个对象通过 stringify 之后提交给后台或者存储在 Storage 里是很常用的手段.但是 IE6-8 下没有 J ...

  9. 对Extjs中时间的多种处理

    1.类型为datetime的json数据处理 (字段类型为datetime) new Date(parseInt(yourTime.substring(6, yourTime.length - 2)) ...

  10. MVC区域小结

    MVC区域小结 MVC区域小结 MVC3一直在学习,项目中有的时候也会用到,博客园也一直逛,想写点什么东西,可惜我这个人平时都很懒,理论层面的东西自己写不来,还是来点实际的简单入门的博客,对自己总结能 ...