用jquery驗證使用者名稱是否有效或重複

最後更新：2013-12-01 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

最近在做畢業設計的時候，新增管理員用到jquery的ajax驗證使用者名稱是否存在，本人初次使用jquery的ajax，發了挺長時間的去網上找相關東西，現在和大家共用我的做法，多多指教。
實現的效果如：

在代碼中使用jquery-1.3.2的vsdoc版本：

1. <script src="/js/jquery/jquery-1.3.2-vsdoc.js" type="text/javascript"></script>
2.     <script type="text/javascript" language="javascript">
3.         $(function() {
4.             $("#txtUserName").focus(function() {
5.                 $(this).addClass("focus");
6.             }).blur(function(){
7.                 $.ajax({
8.                     type: "GET",
9.                     url: "valideUserName_ajax.aspx",
10.                     dataType: "html",
11.                     data: "userName=" + $("#txtUserName").val(),
12.                     beforeSend: function(XMLHttpRequest) {
13.                         $("#showResult").text("正在查詢。。。");
14.                     },
15.                     success: function(msg) {
16.                         $("#showResult").html(msg);
17.                         $("#showResult").css("color", "red");
18.                     },
19.                     complete: function(XMLHttpRequest, textStatus) {
20.                         //隱藏正在查詢圖片
21.                     },
22.                     error: function() {
23.                         //錯誤處理
24.                     }
25.                 });
26.             });
27.         });
28.     </script>
其中上面引用的js代碼中的就是id為txtUserName的textbox先聚焦，失去焦點時，驗證使用ajax判斷使用者名稱是否存在。
1. <asp:TextBox ID="txtUserName" size="25" Height="20px" runat="server"></asp:TextBox>
ajax擷取的頁面：valideUserName_ajax.aspx
前台頁面的代碼如下：
1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.
3. <html xmlns="http://www.w3.org/1999/xhtml" >
4. <head runat="server">
5.     <title>驗證使用者名稱是否存在</title>
6. </head>
7. <body>
8.     <form id="form1" runat="server">
9.     <div>
10.
11.     </div>
12.     </form>
13. </body>
14. </html>
.cs的代碼：本人使用三層架構，如用其他方法，請相應的轉換：
1. public partial class valideUserName_ajax : System.Web.UI.Page
2. {
3.     protected void Page_Load(object sender, EventArgs e)
4.     {
5.         if (!string.IsNullOrEmpty(Request.QueryString["userName"]))
6.         {
7.             if(new zwx.BLL.adminUsers().ExistsUserName(Request.QueryString["userName"].ToString()))
8.             {
9.                 Response.Write("<span class='error'> </span>" + "使用者名稱已經存在，請重新輸入。");
10.             }
11.             else
12.             {
13.                 Response.Write("<span class='success'> </span>" + "恭喜該使用者可以使用，請繼續。");
14.             }
15.         }
16.         else
17.         {
18.             Response.Write("<span class='error'> </span>" + "使用者名稱不可為空！");
19.         }
20.     }
21. }
當完成上面的步驟之後，可以實現判斷使用者名稱是否重複，但是新的問題出現了？
1. “/”應用程式中的伺服器錯誤。
2. --------------------------------------------------------------------------------
3.
4. 此頁的狀態資訊無效，可能已損壞。
5. 說明: 執行當前 Web 請求期間，出現未處理的異常。請檢查堆疊追蹤資訊，以瞭解有關該錯誤以及代碼中導致錯誤的出處的詳細資料。
6.
7. 異常詳細資料: System.Web.HttpException: 此頁的狀態資訊無效，可能已損壞。
8.
9. 源錯誤:
10.
11.
12. [沒有相關的源行]
13.
14.
15. 源檔案: c:\Windows\Microsoft.NET\Framework\v2.0.50727\Temporary ASP.NET Files\root\bab5ae03\ea433214\App_Web_asfn-zfc.1.cs    行: 0
16.
17. 堆疊追蹤:
18.
19.
20. [FormatException: Base-64 字串中的無效字元。]
21.    System.Convert.FromBase64String(String s) +0
22.    System.Web.UI.ObjectStateFormatter.Deserialize(String inputString) +77
23.    System.Web.UI.ObjectStateFormatter.System.Web.UI.IStateFormatter.Deserialize(String serializedState) +4
24.    System.Web.UI.Util.DeserializeWithAssert(IStateFormatter formatter, String serializedState) +37
25.    System.Web.UI.HiddenFieldPageStatePersister.Load() +113
26.
27. [ViewStateException: 無效的檢視狀態。
28.     Client IP: 127.0.0.1
29.     Port:
30.     User-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0; Embedded Web Browser from: http://bsalsa.com/; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; Tablet PC 2.0; 360SE)
31.     ViewState: /wEPDwUJNzMxNjYzNjkwZBgBBR5fX0NvbnRyb2xzUmVxdWlyZVBvc3RCYWNrS2V5X18WHQULY2JsTWFuYWdlJDAFC2NibE1hbmFnZSQwBQxjYmxBcnRpY2xlJDAFDGNibEFydGljbGUkMQUMY2JsQXJ0aWNsZSQyBQxjYmxBcnRpY2xlJDMFDGNibEFydGljbGUkMwUQY2JsQXJ0aWNsZUtpbmQkMAUQY2JsQXJ0aWNsZUtpbmQkMQUQY2JsQXJ0aWNsZUtpbmQkMgUQY2JsQXJ0aWNsZUtpbmQkMwUQY2JsQXJ0aWNsZUtpbmQkMwUIY2JsUGljJDAFCGNibFBpYyQxBQhjYmxQaWMkMgUIY2JsUGljJDMFCGNibFBpYyQzBQxjYmxQaWNLaW5kJDAFDGNibFBpY0tpbmQkMQUMY2JsUGljS2luZCQyBQxjYmxQaWNLaW5kJDMFDGNibFBpY0tpbmQkMwUKY2JsVmlkZW8kMAUKY2JsVmlkZW8kMQUKY2JsVmlkZW8kMgUKY2JsVmlkZW8kMwUKY2JsVmlkZW8kMwUMaW1nQnRuU3VibWl0BQxpbWdCdG5DYW5jbGUzgcuA+4V7gkvpf3QO5Zd66FFRMQ==,/wEPDwUJNzgzNDMwNTMzZGT4DI9jhwcGjbIzQJAyCccg/Xoh1g==
32.     Referer: http://localhost:53227/site_ma...]
33.
34. [HttpException (0x80004005): 此頁的狀態資訊無效，可能已損壞。]
35.    System.Web.UI.ViewStateException.ThrowError(Exception inner, String persistedState, String errorPageMessage, Boolean macValidationError) +106
36.    System.Web.UI.ViewStateException.ThrowViewStateError(Exception inner, String persistedState) +14
37.    System.Web.UI.HiddenFieldPageStatePersister.Load() +217
38.    System.Web.UI.Page.LoadPageStateFromPersistenceMedium() +105
39.    System.Web.UI.Page.LoadAllState() +43
40.    System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +6785
41.    System.Web.UI.Page.ProcessRequest(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +242
42.    System.Web.UI.Page.ProcessRequest() +80
43.    System.Web.UI.Page.ProcessRequestWithNoAssert(HttpContext context) +21
44.    System.Web.UI.Page.ProcessRequest(HttpContext context) +49
45.    ASP.site_mag_manage_editmanage_aspx.ProcessRequest(HttpContext context) in c:\Windows\Microsoft.NET\Framework\v2.0.50727\Temporary ASP.NET Files\root\bab5ae03\ea433214\App_Web_asfn-zfc.1.cs:0
46.    System.Web.CallHandlerExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute() +181
47.    System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously) +75
48.
49.
50.
51.
52. --------------------------------------------------------------------------------
53. 版本資訊: Microsoft .NET Framework 版本:2.0.50727.5448; ASP.NET 版本:2.0.50727.5456
後來又發了很多時間去網上找解決方案。最後找到一個比較滿意的。且決解問題的，方案如下：
通過上網查詢,給出以下解決方案:
在該工程中的web.config中添加如下代碼：
<pages enableEventValidation="False" viewStateEncryptionMode="Never" />
來源: http://www.bkjia.com/kf/201204/129712.html
但是,按照網上給出的方法並沒有解決問題.
如果你在回調前不加這兩句的話 __theFormPostData就會在原來的基礎上再添加現有的網頁狀態post資料，這樣可以說現在回調時你已包含了兩份post資料，但回調時，伺服器方仍然把它當作一份看待，結果伺服器分析不出post資料，只給你返回了一個網頁狀態已損壞的訊息
分析,可能是B頁面,包含form表單才造成問題出現.於是刪除B.aspx中的Form標籤.問題解決.

於是我就將我ajax引用頁面的form刪掉。代碼變成如下：
1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.
3. <html xmlns="http://www.w3.org/1999/xhtml" >
4. <head runat="server">
5. <title>驗證使用者名稱是否存在</title>
6. </head>
7. <body>
8.
9. </body>
10. </html>
對比發現了什麼不一樣了嗎？少了form以及下面的div。
這時你再嘗試一下，發現就這樣實現了添加新的管理員吧。

摘自技術文章

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More

用jquery驗證使用者名稱是否有效或重複

聯繫我們

A Free Trial That Lets You Build Big!

Sales Support

After-Sales Support