AJAX实例一：用AJAX验证注册用户名是否可用
2011-04-25 12:35
639 查看
本例供新手参考。
功能说明：当用户在注册页面输入用户名并且鼠标焦点离开输入框时，到数据表中去验证该用户名是否已经存在，如果存在提示【不可用】，否则，提示【可用】。
必备知识：HTML、JavaScript、C#、ADO.NET，另外就是如何创建AJAX请求对象、使用open()和send()方法以及readyState、status、onreadystatechange、responseText的含义和用法。
本例共用到2个页面：UserReg.aspx—用户注册页面（其实完全可以用静态页面）和 CheckUserName.aspx—把输入的用户名提交到这里验证。
UserReg.aspx前台代码：
Code
1
<%
@ Page Language="C#" AutoEventWireup="true" CodeFile="UserReg.aspx.cs" Inherits="UserReg" %>
2
3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
<html xmlns="http://www.w3.org/1999/xhtml">
5
<head runat="server">
6
<title>无标题页</title>
7
8
<script language="javascript" type="text/javascript">
9
<!--
10
function CheckUserName(userName)
{
11
var xmlhttp;
12
try
{
13
xmlhttp = new ActiveXObject('Msxml2.XMLHTTP');
14
}
15
catch(e)
{
16
try
{
17
xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
18
}
19
catch(e)
{
20
try
{
21
xmlhttp = new XMLHttpRequest();
22
}
23
catch(e)
24
{}
25
}
26
}
27
28
xmlhttp.onreadystatechange=function()
{
29
if(xmlhttp.readyState == 4)
{
30
if(xmlhttp.status == 200)
{
31
var showMes = document.getElementById("showMes");
32
33
if(xmlhttp.responseText == "1")
{
34
showMes.innerHTML="不可用";
35
}
36
else
{
37
showMes.innerHTML= "可用";
38
}
39
}
40
}
41
42
}
43
xmlhttp.open("get","CheckUserName.aspx?userName="+escape(userName));
44
xmlhttp.send(null);
45
}
46
47
//-->
48
</script>
49
50
</head>
51
<body>
52
<form id="form1" runat="server">
53
<div>
54
用户名<asp:TextBox ID="txtUserName" runat="server" onblur="CheckUserName(this.value);"></asp:TextBox>
55
<span id="showMes"></span>
56
<br />
57
密 码<asp:TextBox ID="txtPassword" runat="server"></asp:TextBox>
58
</div>
59
</form>
60
</body>
61
</html>
62
UserReg.aspx后台代码：无
CheckUserName.aspx前台代码（把其他的HTML代码都清除，只留这一行）：
Code
1
<%
@ Page Language="C#" AutoEventWireup="true" CodeFile="CheckUserName.aspx.cs" Inherits="CheckUserName" %>
2
CheckUserName.aspx后台代码：
Code
1
using System;
2
using System.Collections;
3
using System.Configuration;
4
using System.Data;
5
using System.Linq;
6
using System.Web;
7
using System.Web.Security;
8
using System.Web.UI;
9
using System.Web.UI.HtmlControls;
10
using System.Web.UI.WebControls;
11
using System.Web.UI.WebControls.WebParts;
12
using System.Xml.Linq;
13
using System.Data.SqlClient;
14
15
public partial class CheckUserName : System.Web.UI.Page
16
{
17
protected void Page_Load(object sender, EventArgs e)
18
{
19
using (SqlConnection conn = new SqlConnection(
20
System.Configuration.ConfigurationManager.AppSettings["ConnStr"]))
21
{
22
SqlCommand cmd = new SqlCommand();
23
cmd.Connection = conn;
24
cmd.CommandText = string.Format(
25
"Select Count(*) From PUsers Where UserName='{0}'",
26
Request.QueryString["userName"]);
27
conn.Open();
28
if (int.Parse(cmd.ExecuteScalar().ToString()) == 1)
29
{
30
Response.Write("1");
31
}
32
else
33
{
34
Response.Write("2");
35
}
36
}
37
}
38
}
39
摘自：http://www.cnblogs.com/Ferry/archive/2008/12/24/1361435.html
功能说明：当用户在注册页面输入用户名并且鼠标焦点离开输入框时，到数据表中去验证该用户名是否已经存在，如果存在提示【不可用】，否则，提示【可用】。
必备知识：HTML、JavaScript、C#、ADO.NET，另外就是如何创建AJAX请求对象、使用open()和send()方法以及readyState、status、onreadystatechange、responseText的含义和用法。
本例共用到2个页面：UserReg.aspx—用户注册页面（其实完全可以用静态页面）和 CheckUserName.aspx—把输入的用户名提交到这里验证。
UserReg.aspx前台代码：
Code
1
<%
@ Page Language="C#" AutoEventWireup="true" CodeFile="UserReg.aspx.cs" Inherits="UserReg" %>
2
3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
<html xmlns="http://www.w3.org/1999/xhtml">
5
<head runat="server">
6
<title>无标题页</title>
7
8
<script language="javascript" type="text/javascript">
9
<!--
10
function CheckUserName(userName)
{
11
var xmlhttp;
12
try
{
13
xmlhttp = new ActiveXObject('Msxml2.XMLHTTP');
14
}
15
catch(e)
{
16
try
{
17
xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
18
}
19
catch(e)
{
20
try
{
21
xmlhttp = new XMLHttpRequest();
22
}
23
catch(e)
24
{}
25
}
26
}
27
28
xmlhttp.onreadystatechange=function()
{
29
if(xmlhttp.readyState == 4)
{
30
if(xmlhttp.status == 200)
{
31
var showMes = document.getElementById("showMes");
32
33
if(xmlhttp.responseText == "1")
{
34
showMes.innerHTML="不可用";
35
}
36
else
{
37
showMes.innerHTML= "可用";
38
}
39
}
40
}
41
42
}
43
xmlhttp.open("get","CheckUserName.aspx?userName="+escape(userName));
44
xmlhttp.send(null);
45
}
46
47
//-->
48
</script>
49
50
</head>
51
<body>
52
<form id="form1" runat="server">
53
<div>
54
用户名<asp:TextBox ID="txtUserName" runat="server" onblur="CheckUserName(this.value);"></asp:TextBox>
55
<span id="showMes"></span>
56
<br />
57
密 码<asp:TextBox ID="txtPassword" runat="server"></asp:TextBox>
58
</div>
59
</form>
60
</body>
61
</html>
62
UserReg.aspx后台代码：无
CheckUserName.aspx前台代码（把其他的HTML代码都清除，只留这一行）：
Code
1
<%
@ Page Language="C#" AutoEventWireup="true" CodeFile="CheckUserName.aspx.cs" Inherits="CheckUserName" %>
2
CheckUserName.aspx后台代码：
Code
1
using System;
2
using System.Collections;
3
using System.Configuration;
4
using System.Data;
5
using System.Linq;
6
using System.Web;
7
using System.Web.Security;
8
using System.Web.UI;
9
using System.Web.UI.HtmlControls;
10
using System.Web.UI.WebControls;
11
using System.Web.UI.WebControls.WebParts;
12
using System.Xml.Linq;
13
using System.Data.SqlClient;
14
15
public partial class CheckUserName : System.Web.UI.Page
16
{
17
protected void Page_Load(object sender, EventArgs e)
18
{
19
using (SqlConnection conn = new SqlConnection(
20
System.Configuration.ConfigurationManager.AppSettings["ConnStr"]))
21
{
22
SqlCommand cmd = new SqlCommand();
23
cmd.Connection = conn;
24
cmd.CommandText = string.Format(
25
"Select Count(*) From PUsers Where UserName='{0}'",
26
Request.QueryString["userName"]);
27
conn.Open();
28
if (int.Parse(cmd.ExecuteScalar().ToString()) == 1)
29
{
30
Response.Write("1");
31
}
32
else
33
{
34
Response.Write("2");
35
}
36
}
37
}
38
}
39
摘自：http://www.cnblogs.com/Ferry/archive/2008/12/24/1361435.html
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- AJAX实例一：用AJAX验证注册用户名是否可用【原著】
- AJAX实例一：用AJAX验证注册用户名是否可用
- Ajax即使验证用户名是否可用(实例)
- php+ajax 注册验证用户名是否存在实例
- 基于jQuery实现Ajax验证用户名是否可用实例
- Ajax注册验证用户名是否存在 ——引自百度经验
- 表单注册验证用户名是否重复——Ajax学习手记
- javaweb基础----ajax+Hibernate验证用户名是否已被注册
- Ajax验证用户名是否注册案例
- struts使用Ajax验证用户名是否可用
- AJAX(三)--实例无刷新验证用户名是否存在
- 用Ajax实现的验证用户名是否重复实例
- Ajax+PHP动态验证注册用户名是否可用
- struts action使用ajax验证用户名是否有被注册
- 用AJAX实现页面登陆以及注册用户名验证的简单实例
- 使用ajax验证用户名是否被注册
- AJAX .NET验证注册用户名是否已经被使用
- PHP+Ajax检测用户名或邮件注册时是否已经存在实例教程
- 一个简单的用ajax验证注册用户名是否存在的例子
- ajax实现注册页面动态验证用户名是否已注册，不必提交即可验证