asp.net ajax检查用户名是否存在代码
原文 ?asp.net ajax檢查用戶名是否存在代碼
用戶注冊時，我們經(jīng)常需要檢查用戶名是否存在，本文就是實現(xiàn)無刷新驗證用戶名
打開開發(fā)環(huán)境VS 2005,新建項目(或打開現(xiàn)有項目),新建一個Web窗體,命名為 Default.aspx
創(chuàng)建 XMLHttpRequest 對象
所有現(xiàn)代瀏覽器 (IE7+、Firefox、Chrome、Safari 以及 Opera) 都內(nèi)建了 XMLHttpRequest 對象。
通過一行簡單的 JavaScript 代碼，我們就可以創(chuàng)建 XMLHttpRequest 對象。
創(chuàng)建 XMLHttpRequest 對象的語法：
xmlhttp=new XMLHttpRequest();老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 對象：
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");提示：在下一章，我們將使用 XMLHttpRequest 對象從服務(wù)器取回 XML 信息。
代碼如下：
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/網(wǎng)頁特效"><!--???
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('創(chuàng)建失敗');???
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" οnblur="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('創(chuàng)建失敗');
??????????????????????? }
??????????????????? }
??????????????? }
??????????? }
??????? }
??????? 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" οnblur="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);//用線程來模擬數(shù)據(jù)庫教程查詢工作???
13.??????? string[] Names = new string[] { "Sandy", "阿非", "abc" };//這里用Names數(shù)組來代替數(shù)據(jù)庫中的結(jié)果集???
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);//用線程來模擬數(shù)據(jù)庫查詢工作
??????? string[] Names = new string[] { "Sandy", "阿非", "abc" };//這里用Names數(shù)組來代替數(shù)據(jù)庫中的結(jié)果集
??????? if (Array.IndexOf<string>(Names, _name) == -1)
??????? {
??????????? context.Response.Write("恭喜，用戶名可以使用。");
??????? }
??????? else
??????? {
??????????? context.Response.Write("抱歉，用戶名已被使用。");
??????? }
??? }
?
??? public bool IsReusable {
??????? get {
??????????? return false;
??????? }
??? }
}
到這里程序已經(jīng)完成。
主要是利用了XMLHttpRequest對象采用異步的方式去訪問服務(wù)器，獲得響應(yīng)后觸發(fā)定義好的回調(diào)函數(shù)
本文是XMLHttpRequest對象異步方式對服務(wù)器發(fā)送Get方式的請求，訪問服務(wù)器的文件為.ashx
總結(jié)
以上是生活随笔為你收集整理的asp.net ajax检查用户名是否存在代码的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： bcdedit
- 下一篇： SharpDeveloeper开发ASP