Ajax 无刷新 判断用户是否存在！！！

Ajax无刷新，注册的时候，你输入了用户名，然后按TAB去输入其他信息，这时，网页会通过Ajax与服务器交互，来判断你的用户名是否被注册了，然后显示出来。很简单的一个小例子。谢谢！

解决方案 »

  1.   

    很多方法的，其中一种AjaxPro实现，如下<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxProTest.aspx.cs" Inherits="AJAXPro_Pro_AjaxProTest" %><!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" language="javascript">
            function checkUserName(source)
            {
                var userName = source.value;
                //注意：AJAXPro_Pro_AjaxProTest是AjaxProTest.aspx页面对应的class名称
                //也就是在这里通过JavaScript调用服务器上的方法并接受返回的结果
                var result = AJAXPro_Pro_AjaxProTest.checkName(userName).value;
                document.getElementById("msg").innerHTML = result;
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
        <ul style="margin-left:0px; list-style-type:none;">
            <li>用户名：<input id="txtUserName" type="text" onblur="checkUserName(this)" /></li>
            <li id="msg"></li>
            <li>密码：<input id="txtPassword" type="password" /></li>
        </ul>
        </div>
        </form>
    </body>
    </html>using System;
    using System.Collections;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.HtmlControls;
    using System.Web.UI.WebControls;using AjaxPro;public partial class AJAXPro_Pro_AjaxProTest : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            //注册Type
            AjaxPro.Utility.RegisterTypeForAjax(typeof(AJAXPro_Pro_AjaxProTest),this);
        }    /// <summary>
        /// 检查用户名
        /// </summary>
        /// <res>
        /// 有AjaxPro调用的方法必须有AjaxMethod属性
        /// </res>
        /// <param name="userName">要检查的用户名</param>
        /// <returns></returns>
        [AjaxMethod]
        public string checkName(string userName)
            //这个方法是提供前台JavaScript调用的
        {
            bool exists = false;
            if (userName.CompareTo("admin") == 0)
            {
                exists = true;
            }
            if (exists)
            {
                return string.Format("<font color='red'>{0}这个用户已经被注册</font>", userName);
            }
            else
            {
                return string.Format("<font color='green'>{0}这个用户暂未被注册</font>",userName);
            }
        }
    }
      

  2.   


    XMLHttpRequest实现无刷新验证用户名
    http://blog.csdn.net/Sandy945/archive/2009/05/12/4169870.aspx
      

  3.   

    http://topic.csdn.net/u/20100122/17/2fd20620-322b-4910-ad35-3b3173b651a9.html
      

  4.   

    方法很多，不过我一般都用JQuery的$.get()方法  很好用。。
      

  5.   

    我也是用的JQuery的方法，很简单好用。
      

  6.   

    funtion CreateXmlHttp()
    {
    var xmlHttp=null;
    if (window.XMLHttpRequest) 
    { 
    xmlhttp=new XMLHttpRequest(); 
    } 
    else if (window.ActiveXObject) 
    { 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    return xmlhttp; 
    }function CheckUserName()
    {
    var xmlHttp=CreateXmlHttp()
    http.open("GET","CheckUserName.ashx?username="+document.getElementById("txtUserName"),value, true); 
    http.onreadystatechange=ShowCheckResult; 
    http.send(null); 
    }function ShowCheckResult()
    {
    if xmlHttp.readyState==400&& xmlHttp.stutas=200
    {
    var result=xmlHttp.responseText;
    if(result==1)
    alert("恭喜你 用户名可用")
    else("异常遗憾，该名字已被注册")；
    }
    }
    对应的ASHX页面
    <%@ WebHandler Language="C#" Class="CheckUserName" %> using System; 
    using System.Web; public class CheckUserName: IHttpHandler 
    {     public void ProcessRequest(HttpContext context) 
        { 
            context.Response.ContentType = "text/HTML"; 
        if(UserNameIfExist())
    context.Response.Write("1");           else
    context.Response.Write("0");
       
        }     protected bool UserNameIfExist()
       {
        string username = context.Request.QueryString["username"]; 
        然后用username在数据库查询 ，返回结果
       }
        public bool IsReusable 
        { 
            get 
            { 
                return false; 
            } 
        } } 
      

  7.   

    ajax异步获取数据，查询用户数据  
    <script type="text/javascript">  
      var xmlHttp;  
      function createXMLHttpRequest()  
      {  
      if(window.ActiveXObject)  
      {  
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");  
      }  
      else if(window.XMLHttpRequest)  
      {  
      xmlHttp = new XMLHttpRequest();  
      }  
      }  
      function CheckUserName()  
      {  
      var us=document.getElementById("txtname").value;  
      if(us!="")  
      {  
      createXMLHttpRequest();  
      var url= "RegistValidate.ashx?username="+escape(document.getElementById("txtname").value);  
      xmlHttp.open("GET",url,true);  
      xmlHttp.onreadystatechange=ShowResult;  
      xmlHttp.send(null);  
      }  
      }  
      function ShowResult()  
      {  
      if(xmlHttp.readyState==4)  
      {  
      if(xmlHttp.status==200)  
      {  
      var s;  
      s=xmlHttp.responseText;  
      alert(s);  
      }  
      }  
      }  
    </script>  
     
      

  8.   

    在checkName方法里自己写个就可以了，这个不用源码呈现了吧？