ajax 实现用户名是否存在 源代码

使用Ajax检查用户名可用性
原创 于 2008-04-18 17:16:00 发布 · 458 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#ajax

本文介绍了一个使用ASP.NET和Ajax实现的实时用户名检查功能。该功能能够在用户输入用户名的同时，通过Ajax调用服务器端方法检查该用户名是否已被占用，并即时反馈结果。

aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="CheckUsernameWithAjax._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>CheckUsernameWithAjax</title>
</head>
<body>
    <form id="form" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" />
        
        Last Postback: <%= DateTime.Now %>
        <br /><br />
        
        <asp:Label ID="lblUserName" runat="server" AssociatedControlID="UserName">Desired Username</asp:Label>
        <asp:TextBox ID="UserName"  runat="server" CssClass="txt" onkeyup="usernameChecker(this.value);" />
        <span id="spanAvailability"></span>
        
        
        <script type="text/javascript">
            var usernameCheckerTimer;
            var spanAvailability = $get("spanAvailability");

            function usernameChecker(username) 
            {
                clearTimeout(usernameCheckerTimer);
                if (username.length == 0)
                    spanAvailability.innerHTML = "";
                else
                {
                    spanAvailability.innerHTML = "<span style='color: #ccc;'>checking...</span>";
                    usernameCheckerTimer = setTimeout("checkUsernameUsage('" + username + "');", 750);
                }
            }

            function checkUsernameUsage(username) 
            {
                // initiate the ajax pagemethod call
                // upon completion, the OnSucceded callback will be executed
                PageMethods.IsUserAvailable(username, OnSucceeded);
            }

            // Callback function invoked on successful completion of the page method.
            function OnSucceeded(result, userContext, methodName) 
            {
                if (methodName == "IsUserAvailable")
                {
                    if (result == true)
                        spanAvailability.innerHTML = "<span style='color: DarkGreen;'>Available</span>";
                    else
                        spanAvailability.innerHTML = "<span style='color: Red;'>Unavailable</span>";
                }
            }
        </script>        
    </form>
</body>
</html>

aspx.cs

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Web.Services;

namespace CheckUsernameWithAjax
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        [WebMethod]
        public static bool IsUserAvailable(string username)
        {
            if (username.ToLower() == "storm")
                return false;
            else
                return true;
        }
    }
}

 

stormlly
关注
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值