asp.net ajax检查用户名是否存在代码
用户注册时,我们经常需要检查用户名是否存在,本文就是实现无刷新验证用户名
打开开发环境VS 2005,新建项目(或打开现有项目),新建一个Web窗体,命名为 Default.aspx
创建 XMLHttpRequest 对象
所有现代浏览器 (IE7+、Firefox、Chrome、Safari 以及 Opera) 都内建了 XMLHttpRequest 对象。
通过一行简单的 JavaScript 代码,我们就可以创建 XMLHttpRequest 对象。
创建 XMLHttpRequest 对象的语法:
xmlhttp=new XMLHttpRequest();老版本的 Internet Explorer (IE5 和 IE6)使用 ActiveX 对象:
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");提示:在下一章,我们将使用 XMLHttpRequest 对象从服务器取回 XML 信息。
代码如下:
01.<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
02.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
03.<html xmlns="http://www.w3.org/1999/xhtml" >
04.<head runat="server">
05. <title>无标题页</title>
06. <script type="text/网页特效"><!--
07. var xmlHttp=null;
08.
09. function createXMLHttpRequest()
10. {
11. if(xmlHttp == null){
12. if(window.XMLHttpRequest) {
13. //Mozilla 浏览器
14. xmlHttp = new XMLHttpRequest();
15. }else if(window.ActiveXObject) {
16. // IE浏览器
17. try {
18. xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
19. } catch (e) {
20. try {
21. xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
22. } catch (e) {
23. //alert('创建失败');
24. }
25. }
26. }
27. }
28. }
29. function openAjax()
30. {
31. if( xmlHttp == null)
32. {
33. createXMLHttpRequest();
34. if( xmlHttp == null)
35. {
36. //alert('出错');
37. return ;
38. }
39. }
40.
41. var val=document.getElementById('txt').value;
42.
43. xmlHttp.open("get","VerifyUserNameHandler.ashx?para="+val+"&date="+new Date(),true);
44. xmlHttp.onreadystatechange=xmlHttpChange;
45. xmlHttp.send(null);
46.
47. document.getElementById('resultSpan').innerText='正在检查,请稍候...';
48. }
49.
50. function xmlHttpChange()
51. {
52. if(xmlHttp.readyState==4)
53. {
54. if(xmlHttp.status==200)
55. {
56. var res=xmlHttp.responseText;
57. document.getElementById('resultSpan').innerText=res;
58.
59. if(res=='恭喜,用户名可以使用。')
60. {
61. setTimeout("document.getElementById('resultSpan').innerText='';",2000);
62. }
63. else if(res=='抱歉,用户名已被使用。')
64. {
65. document.getElementById('txt').focus();
66. }
67. }
68. }
69. }
70.// --></script>
71.</head>
72.<body>
73. <form id="form1" runat="server">
74. 用户名:<input type="text" id='txt' value="Sandy" onblur="openAjax();" /> <span id="resultSpan"></span>
75. </form>
76.</body>
77.</html>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script type="text/javascript"><!--
var xmlHttp=null;
function createXMLHttpRequest()
{
if(xmlHttp == null){
if(window.XMLHttpRequest) {
//Mozilla 浏览器
xmlHttp = new XMLHttpRequest();
}else if(window.ActiveXObject) {
// IE浏览器
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
//alert('创建失败');
}
}
}
}
}
function openAjax()
{
if( xmlHttp == null)
{
createXMLHttpRequest();
if( xmlHttp == null)
{
//alert('出错');
return ;
}
}
var val=document.getElementById('txt').value;
xmlHttp.open("get","VerifyUserNameHandler.ashx?para="+val+"&date="+new Date(),true);
xmlHttp.onreadystatechange=xmlHttpChange;
xmlHttp.send(null);
document.getElementById('resultSpan').innerText='正在检查,请稍候...';
}
function xmlHttpChange()
{
if(xmlHttp.readyState==4)
{
if(xmlHttp.status==200)
{
var res=xmlHttp.responseText;
document.getElementById('resultSpan').innerText=res;
if(res=='恭喜,用户名可以使用。')
{
setTimeout("document.getElementById('resultSpan').innerText='';",2000);
}
else if(res=='抱歉,用户名已被使用。')
{
document.getElementById('txt').focus();
}
}
}
}
// --></script>
</head>
<body>
<form id="form1" runat="server">
用户名:<input type="text" id='txt' value="Sandy" onblur="openAjax();" /> <span id="resultSpan"></span>
</form>
</body>
</html>
然后新建一个一般处理程序,命名为 VerifyUserNameHandler.ashx
代码如下:
view plaincopy to clipboardprint?
01.<%@ WebHandler Language="C#" class="VerifyUserNameHandler" %>
02.using System;
03.using System.Web;
04.using System.Collections;
05.using System.Collections.Generic;
06.public class VerifyUserNameHandler : IHttpHandler {
07.
08. public void ProcessRequest (HttpContext context) {
09. //context.Response.ContentType = "text/plain";
10. string _name = context.Request.QueryString["para"];
11. _name = string.IsNullOrEmpty(_name) ? "" : _name;
12. System.Threading.Thread.Sleep(3000);//用线程来模拟数据库教程查询工作
13. string[] Names = new string[] { "Sandy", "阿非", "abc" };//这里用Names数组来代替数据库中的结果集
14. if (Array.IndexOf<string>(Names, _name) == -1)
15. {
16. context.Response.Write("恭喜,用户名可以使用。");
17. }
18. else
19. {
20. context.Response.Write("抱歉,用户名已被使用。");
21. }
22. }
23.
24. public bool IsReusable {
25. get {
26. return false;
27. }
28. }
29.}
<%@ WebHandler Language="C#" class="VerifyUserNameHandler" %>
using System;
using System.Web;
using System.Collections;
using System.Collections.Generic;
public class VerifyUserNameHandler : IHttpHandler {
public void ProcessRequest (HttpContext context) {
//context.Response.ContentType = "text/plain";
string _name = context.Request.QueryString["para"];
_name = string.IsNullOrEmpty(_name) ? "" : _name;
System.Threading.Thread.Sleep(3000);//用线程来模拟数据库查询工作
string[] Names = new string[] { "Sandy", "阿非", "abc" };//这里用Names数组来代替数据库中的结果集
if (Array.IndexOf<string>(Names, _name) == -1)
{
context.Response.Write("恭喜,用户名可以使用。");
}
else
{
context.Response.Write("抱歉,用户名已被使用。");
}
}
public bool IsReusable {
get {
return false;
}
}
}
到这里程序已经完成。
主要是利用了XMLHttpRequest对象采用异步的方式去访问服务器,获得响应后触发定义好的回调函数
本文是XMLHttpRequest对象异步方式对服务器发送Get方式的请求,访问服务器的文件为.ashx
asp.net ajax检查用户名是否存在代码的更多相关文章
- asp.net ajax 检测用户名是否可用代码
原文 asp.net ajax 检测用户名是否可用代码 .net ajax 检测用户名是否可用代码 <script type="text/网页特效" src="c ...
- Ajax (Asynchronous javascript xml) 搜索框核心代码(JQuery) Ajax判断用户名存在核心代码 附:原生js的Ajax代码 其中有json的一句话解释
前端 <script type="text/javascript"> $(function(){ $("#tid").keyup(function( ...
- ajax检查用户名重复
1.获取ajax对象 new XMLHttpRequest(); IE6-8: new ActiveXOject("Microsoft.XMLHTTP"); 兼容判断:if(XML ...
- ajax检查用户名是否存在
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.c ...
- ajax检查用户名
Ajax实现的效果 究竟Ajax能实现什么功能呢?今天下午学习了一下Ajax,现在跟大家分享一下我的学习心得.Ajax是什么?工作机制又是什么?可能不大准确,只是我个人看了视频学习后的一点点看法. A ...
- asp.net C#检查URL是否有效
我们有时候需要对用户输入的网站(URL)进行有效性检查, 代码如下 复制代码 function CheckUrl(str) { var RegUrl = new RegExp(); Re ...
- asp.net ajax实现md5加密
1. [图片] asp.net ajax 效果截图.png 2. [代码]前端代码HTML/Javascript/jQuery <!DOCTYPE html PUBLIC "-//W3 ...
- 客户端调用服务器端方法——ASP.NET AJAX(Atlas)、Anthem.NET和Ajax.NET Professional实现之小小比较
前几天曾经发过一篇<ASP.NET AJAX(Atlas)和Anthem.NET——管中窥豹般小小比较>,Jeffrey Zhao说用ASP.NET AJAX中的UpdatePanel似乎 ...
- AJAX异步检查,检查用户名是否存在
AJAX异步检查,检查用户名是否存在 写法一: var xmlHttp; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, ...
随机推荐
- 网络编程(UDP协议-聊天程序)
网络编程中的UDP协议中聊天程序,发送端口,和接受端口. 发送端口(Send): <span style="font-size:18px;">package cn.it ...
- hdu1730 Northcott Game,Nim-sum
题解: 转化成求Nim-sum 每行黑白棋的初始间距作为每堆石子个数 假设当前为P态,则无论当前选手如何操作,下一个选手都能使其操作后的局面又变为P态. Nim-sum = 0,即P态. #inclu ...
- Axis2(7):将Spring的装配JavaBean发布成WebService
在现今的Web应用中经常使用Spring框架来装载JavaBean.如果要想将某些在Spring中装配的JavaBean发布成WebService,使用Axis2的Spring感知功能是非常容易做到的 ...
- 【转】文件恢复神器extundelete
参考博文: 1.Linux中VMware虚拟机增加磁盘空间的扩容操作 http://www.net130.com/CMS/Pub/special/special_virtual/special_vir ...
- iTextSharp - 建立PDF文件
原文 iTextSharp - 建立PDF文件 01 using iTextSharp.text; 02 using iTextSharp.text.pdf; 03 ... 04 private vo ...
- cocos2d-x游戏开发系列教程-中国象棋02-main函数和欢迎页面
之前两个博客讲述了象棋的规格和工程文件之后,我们继续深入的从代码开始学习cocos2dx 首先从程序入口main函数开始 main函数 int APIENTRY _tWinMain(HINSTANCE ...
- APEC计划指引我们前进:云计算服务将上升
APEC纲领指引我们前进:云计算服务业必将兴起 这是APEC领导人的合影: 这次APEC会议通过了<北京纲领>和<亚太伙伴关系声明>,进一步明白了亚太地区经济合作的发展方向.目 ...
- 【linux kernel】 softirq 软中断讨论
欢迎转载,转载时需保留作者信息,谢谢. 邮箱:tangzhongp@163.com 博客园地址:http://www.cnblogs.com/embedded-tzp Csdn博客地址:http:// ...
- BZOJ 3357: [Usaco2004]等差数列( dp )
dp(x, p) 表示序列中第x个数, 上一个数是p构成的等差数列的最长. 转移时从[1, x)中枚举p = seq[] 就行了.时间复杂度O(n²logn) -------------------- ...
- 分布式消息系统jafka快速起步(转)
Jafka 是一个开源的/性能良好的分布式消息系统.在上一篇文章中有所简单介绍.下面是一篇简单的入门文档.更多详细的文档参考wiki. Step 1: 下载最新的安装包 完整的安装指南在这里.最新的发 ...