register.php

  1. <html>
  2. <head>
  3. <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  4. <title>用户注册</title>
  5. <script type="text/javascript">
  6. //创建ajax引擎
  7. function getXmlHttpObject(){
  8. 	//不同的浏览器获取xmlhttprequest 的方法不一样
  9. 	if(window.ActiveXObject){
  10. 		//window.alert('ie');
  11. 		xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");
  12. 		}
  13. 	else{
  14. 		//window.alert('ff');
  15. 		xmlHttpRequest=new XMLHttpRequest();
  16. 		}
  17. 	return xmlHttpRequest;
  18. }
  19. var myXmlHttpRequest="";
  20. function checkName(){
  21. 	myXmlHttpRequest=getXmlHttpObject();//1号线
  22. 	if(myXmlHttpRequest){
  23. 		//window.alert("创建Ajax引擎成功！");
  24. 		//通过myXmlHttpRequest对象发送请求到服务器的某一个页面
  25. 		//第一个参数表示请求的方式，get/post
  26. 		//第二个参数指定url，对那个页面发出ajax请求(本质仍然是http请求)，只要是web开发的底层是http请求，http的底层是tcp/ip协议
  27. 		//第三个参数 true 表使用异步机制，false表示不使用异步机制。
  28. 		//打开请求
  29. 		//var url="/ajax/registerPro.php?username="+$("username").value;
  30. 		//var url="/ajax/registerPro.php?mytime="+new date()+"&username="+$("username").value;
  31. 		var url="/ajax/registerPro.php";
  32. 		//这个是要发送数据
  33. 		var data="username="+$("username").value;
  34. 		//window.alert(url);
  35. 		myXmlHttpRequest.open("post",url,true);
  36. 		//这句话不可少
  37. 		//http_request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
  38. 		myXmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
  39. 		//指定回调函数 . chuli是函数名
  40. 		myXmlHttpRequest.onreadystatechange=chuli;
  41. 		//真的发送请求，如果是get请求发送null即可；如果是post请求，则填入实际的请求即可
  42. 		//myXmlHttpRequest.send(null); //2号线
  43. 		myXmlHttpRequest.send(data); //2号线
  44. 		}
  45. }
  46. //回调函数
  47. function chuli(){
  48.  
  49. 	//window.alert("回调函数成功!!"+xmlHttpRequest.readyState);
  50. 	//还是取值了
  51. 	if(xmlHttpRequest.readyState==4){
  52. 			//window.alert("服务器返回"+xmlHttpRequest.responseText);
  53. 			$("myres").value=xmlHttpRequest.responseText;
  54. 		}
  55. }
  56. //这里写一个函数
  57. function $(id){
  58.  	return document.getElementById(id);
  59.  }
  60. </script>
  61. </head>
  62. <body>
  63. 	<form action="" method="post">
  64. 			用户名字：<input type="text" onkeyup="checkName()" name="username1" id="username" />
  65. 			<input onclick="checkName();" type="button" value="验证用户名" /><input style="border-width:0px;color:red;" type="text" id="myres"/> <br />
  66. 			用户密码：<input type="password" name="password" /> <br />
  67. 			电子邮件：<input type="text" name="email" /> <br /> <input type="button" value="注册账号">
  68. 	</form>
  69. </body>
  70. </html> 

registerPro.php

  1. $username = $_POST['username'];
  2. // echo "用户名是：" . $username; // 3号线
  3. if ($username == "zhosoft") {
  4. 	echo "此用户名不可用！";  // 注意，这里的数据是返回给请求的页面。
  5. } else {
  6. 	echo "恭喜您，此用户名可用！";
  7. }

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. 2. SQL Server数据库状态监控 - 错误日志

    原文:2. SQL Server数据库状态监控 - 错误日志 无论是操作系统 (Unix 或者Windows),还是应用程序 (Web 服务,数据库系统等等) ,通常都有自身的日志机制,以便故障时追溯 ...

  2. Floodlight controller 线程池模型

         官方文档对于ThreadPool的描写叙述是:ThreadPool is a Floodlight module wrapper for a Java's ScheduledExecutor ...

  3. Visual Studio 2015 & C#6.0

      Visual Studio 2015 & C#6.0 试用报告,持续更新.   昨天早上看到了.net开源的消息,我是非常兴奋的,毕竟局限于Windows的.NET经常被人唾弃.VB暂且不 ...

  4. [ext/iconv/iconv.lo] Error 1

    办法1: wget http://ftp.gnu.org/pub/gnu/libiconv/libiconv-1.13.1.tar.gz tar -zxvf libiconv-1.13.1.tar.g ...

  5. 【转】webAPP快速入门

    WebApp与Native App有何区别呢? Native App: 1.开发成本非常大.一般使用的开发语言为JAVA.C++.Objective-C. 2.更新体验较差.同时也比较麻烦.每一次发布 ...

  6. 安装64位的oracle连接客户端

    VS自带的WebServer只有32位的,你只能以32位运行,即使你的VS里面编译目标是64位的, 注意:发布到iis,可以以64位运行,你需要安装64位的oracle连接客户端.如果没有,你的程序必 ...

  7. MVC使用RDL报表

    MVC使用RDL报表 这次我们来演示MVC3怎么显示RDL报表,坑爹的微软把MVC升级到5都木有良好的支持报表,让MVC在某些领域趋于短板 我们只能通过一些方式来使用rdl报表. Razor视图不支持 ...

  8. HTTP协议与HTML form

    HTTP协议与HTML form HTTP协议是应用层协议, 全称是HyperText Transfer Protocol HTTP协议是一种请求回应式的, 一个Request一定会有一个Respon ...

  9. Codekart 框架

    [Node.js框架] 为什么要开发 Codekart 框架 两年前,在被php的$符号和字符串处理折磨得半夜骂娘之后,我义无反顾地决定:珍爱生命,远离php. 之后一直在寻找一门“完美的语言”,先后 ...

  10. 最短路模板[spfa][dijkstra+堆优化][floyd]

    借bzoj1624练了一下模板(虽然正解只是floyd) spfa: #include <cstdio> #include <cstring> #include <alg ...