JQuery運用ajax注冊用戶實例(後台asp.net)

復制代碼 代碼如下:
//JS代碼

function checkname() {
var Msg = document.getElementById("d_username");
var chk = CheckN();
if (chk) {
$.ajax({ url: 'registerOK.aspx',
type: 'POST',
data: { lb: "checkname", username: $("#username").val() },
dataType: 'html',
timeout: 1000,
error: function() { alert('出現未知錯誤，請與QQ:6434789聯系。'); },
success: function(data) {
if (data == "對不起，該用戶名已被注冊！") {
Msg.className = "d_err";
Msg.innerHTML = data;
$("#hiddencheckname").val("no");
}
if (data == "恭喜，該用戶名可以注冊！") {
Msg.className = "d_ok";
Msg.innerHTML = data;
$("#hiddencheckname").val("yes");
}
if (data == "該用戶名不能為中文！") {
Msg.className = "d_err";
Msg.innerHTML = data;
$("#hiddencheckname").val("no");
}
if (data == "請輸入用戶名！") {
Msg.className = "d_err";
Msg.innerHTML = data;
$("#hiddencheckname").val("no");
}
}
});
}
}

function CheckN() {
var Msg = document.getElementById("d_username");
var chk = true;
if (checkIsChinese(document.getElementById("username").value)) {
Msg.className = "d_err";
Msg.innerHTML = "用戶名不能為中文！";
chk = false;
}
if (document.getElementById("username").value.length < 4) {
Msg.className = "d_err";
Msg.innerHTML = "用戶名不能少於4個字符！";
chk = false;
}
return chk;
}

function chk_reguser() {
var chk = true
// if (!checkname()) { chk = false; } //jquery進行變量賦值不能與js裡面的變量共用，故success: function(data) {}裡面定義的任何變量與所在的js代碼中的變量是不相通的，所以我就找一個種比較偏（非正式）的方法，為在html中加入隱藏的Input並在js裡面設置$("#hiddencheckname").val("no");
if (!CheckN()) {chk = false;}
if ($("#hiddencheckname").val() == "no") { chk = false; }//這個是對其判斷
if (!checkpwd()) { chk = false; }//這些跟CheckN()差不多一樣，只是對表單裡面的元素進行驗證
if (!checkpwd1()) { chk = false; }
if (!checkquestion()) { chk = false; }
if (!checkanswer()) { chk = false; }
if (!checkxq()) { chk = false; }
if (!checkrealname()) { chk = false; }
if (!checktel()) { chk = false; }
if (!checkQQMSN()) { chk = false; }
if (!checkEmail()) { chk = false; }
if (!checkaddress()) { chk = false; }
if (chk) {
$.ajax({ url: 'registerOK.aspx',
type: 'POST',
data: { lb: "reguser", username: $("#username").val(), password: $("#pwd").val(), question: $("#question").val(), answer: $("#answer").val(), xqcode: $("#ctl00_CPH_Main_DDL_xq").val(), realname: $("#realname").val(), sex: $("input[@name=sex][@checked]").val(), tel: $("#tel").val(), QQMSN: $("#QQMSN").val(), email: $("#email").val(), address: $("#address").val() },
dataType: 'html',
timeout: 1000,
error: function() { alert('出現未知錯誤，請與QQ:6434789聯系。'); },
success: function(data) {
if (data == "success") {
alert("注冊成功！");
window.location.href = "/member/index.aspx";
}
else {
alert("注冊失敗，原因可能為用戶名已被注冊！");
}
}
});
return (true);
}
return (false);
}

//HTML頁

只要做類似於這樣的表單
復制代碼 代碼如下:
<input id="username" type="text" onBlur="checkname()" />
<div class=d_default id=d_username>請輸入4位以上的英文字符或數字！</div>
<input id="Button_OK" type="button" onclick="return chk_reguser();"/>

//registerOK.aspx.cs
復制代碼 代碼如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using BLL;

public partial class registerOK : System.Web.UI.Page
{
user user = new user();
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
string lb = Request["lb"];
string username = Request["username"];
string password = Request["password"];
string question = Request["question"];
string answer = Request["answer"];
string xqcode = Request["xqcode"];
string realname = Request["realname"];
string sex = Request["sex"];
string tel = Request["tel"];
string QQMSN = Request["QQMSN"];
string email = Request["email"];
string address = Request["address"];
if (lb == "checkname")
{
Response.Write(user.CheckUserName(username));
}
if (lb == "reguser")
{
string name = user.CheckUserName(username);
if (name == "恭喜，該用戶名可以注冊！")
{
user.Add(username, password, question, answer, xqcode, realname, sex, tel, QQMSN, email, address);
Response.Write("success");
}
else
{
Response.Write("fail");
}
}
}
}
}

注：registerOK.aspx頁面必須清空所有的HTML代碼，如只剩下<%@ Page Language="C#" AutoEventWireup="true" CodeFile="registerOK.aspx.cs" Inherits="registerOK" %>。