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. Linq to Sql：N层应用中的查询(上) : 返回自定义实体

    原文:Linq to Sql:N层应用中的查询(上) : 返回自定义实体 如果允许在UI层直接访问Linq to Sql的DataContext,可以省去很多问题,譬如在处理多表join的时候,我们使 ...

  2. [推荐]ORACLE PL/SQL编程详解之一：PL/SQL 程序设计简介(千里之行，始于足下)

    原文:[推荐]ORACLE PL/SQL编程详解之一:PL/SQL 程序设计简介(千里之行,始于足下) [推荐]ORACLE PL/SQL编程详解之一: PL/SQL 程序设计简介(千里之行,始于足下 ...

  3. window批量-6 rem

    行动: 凝视命令,加大对批量处理相应的描述性信息 格公式: rem [comment] demo: bat @echo off pause rem 这是对pause的解释 echo xxx pause ...

  4. SQL点滴27—性能分析之执行计划

    原文:SQL点滴27-性能分析之执行计划 一直想找一些关于SQL语句性能调试的权威参考,但是有参考未必就能够做好调试的工作.我深信实践中得到的经验是最珍贵的,书本知识只是一个引导.本篇来源于<I ...

  5. 2.2 LINQ中使用from子句指定数据源

    数据源是LINQ查询中必不可少的元素,数据源是实现泛型接口IEnumerable<T>或IQueryable<T>的类对象. 可以将IEnumerable<T>简单 ...

  6. 工欲善其事：编辑器之神Vim（一）

    本篇文章收集了Vim最常用和实用的一些命令,掌握这些命令就可以使用Vim了 本文仅列举个人认为常用的命令,本系列文章更像是自己的学习笔记,而不是VIM使用教程. 如果你想了解vim的更多,可以看看Co ...

  7. [Android 性能优化系列]降低你的界面布局层次结构的一部分

    大家假设喜欢我的博客,请关注一下我的微博,请点击这里(http://weibo.com/kifile),谢谢 转载请标明出处(http://blog.csdn.net/kifile),再次感谢 原文地 ...

  8. Python框架之Django学习

    当前标签: Django   Python框架之Django学习笔记(十四) 尛鱼 2014-10-12 13:55 阅读:173 评论:0     Python框架之Django学习笔记(十三) 尛 ...

  9. javascript保留两位

    原文:javascript保留两位 //保留两位小数 //功能:将浮点数四舍五入,取小数点后2位 function toDecimal(x) { var f = parseFloat(x); if ( ...

  10. 个人总结js客户端验证

    //郭泽峰个人总结总结(2012-12-5): //备注:当 regu是字符串时应示例对象RegExp,否则的话 var emailReg =/在此加上正则/ //验证邮箱 function Chec ...