在.net中要實(shí)現(xiàn)button控制點(diǎn)擊之后先執(zhí)行js再執(zhí)行后臺(tái)程序這個(gè)看上去沒(méi)什么難度，這里我們就一起來(lái)看一個(gè)asp.net中button控制先執(zhí)行js再執(zhí)行后臺(tái)程序的實(shí)現(xiàn)方法，希望可以幫助到各位。

關(guān)于button這個(gè)服務(wù)器控件，我一直想減少它向服務(wù)器提交數(shù)據(jù)。那些檢測(cè)，還是在客戶端實(shí)現(xiàn)就好了。

這就需要javascript，但是我發(fā)現(xiàn)僅僅有javascript還是不夠的。button服務(wù)器控件的單擊事件叫“onClick”，所以javascript就無(wú)法使用這個(gè)事件。因?yàn)橹孛?。我想?shí)現(xiàn)的是單擊button的時(shí)候，先執(zhí)行客戶端的javascript代碼，然后再執(zhí)行后臺(tái)事件。

如果使用的是html控件，就不存在這種問(wèn)題了。但是，我就是想實(shí)現(xiàn)服務(wù)器控件的這一功能，有時(shí)候服務(wù)器控件也是很好用的。
先給aspx頁(yè)面增加一個(gè)服務(wù)器控件button

在頁(yè)面初始化的時(shí)候，給button這個(gè)服務(wù)器控件增加一個(gè)客戶端事件。也就是在Page_Load()這個(gè)方法里面加一句代碼:

復(fù)制代碼代碼如下:

if (!IsPostBack)

{

 //給button1添加客戶端事件

 btnSave.Attributes.Add("OnClick", "return UserAddVerify()");

}

UserAddVerify 是js端實(shí)現(xiàn)的函數(shù)，主要用來(lái)檢測(cè)數(shù)據(jù)的有效性。

復(fù)制代碼代碼如下:

function UserAddVerify() {

    var userName = document.getElementById("TxtUserName").value;

    var password = document.getElementById("TxtUserPassword").value;

    var repassword = document.getElementById("TxtUserPasswordConfirm").value;

    var identity = document.getElementById("TxtUserIdentity").value;

    var mobile = document.getElementById("TxtUserMobile").value;

    var realName = document.getElementById("TxtUserRealName").value;

    var btnSave = document.getElementById("btnSave");

    var identityReg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;

    var mobileReg = /1[3-8]+\d{9}/;

    if (userName == "" || userName == null) {

        alert("用戶名不能為空");

        return false;

    }

    else if (password == "" || password == null) {

        alert("密碼不能為空");

        return false;

    }

    else if (repassword == "" || repassword == null || repassword != password) {

        alert("對(duì)不起，兩次輸入密碼不一樣");

        return false;

    }

    else if (identity == "" || identity == null || identityReg.test(identity) === false) {

        alert("請(qǐng)輸入合法的身份證號(hào)碼");

        return false;

    }

    else if (mobile == "" || mobile == null || mobileReg.test(mobile) == false) {

        alert("請(qǐng)輸入合法的手機(jī)號(hào)碼");

        return false;

    }

    else if (realName == "" || realName == null) {

        alert("姓名不能為空");

        return false;

    }

    return true;

}

上面的return ture和false是很重要的，這決定了是否往下執(zhí)行，往下執(zhí)行就應(yīng)該是將數(shù)據(jù)提交到后臺(tái)處理數(shù)據(jù)。當(dāng)返回true時(shí)，后臺(tái)執(zhí)行button1_Click這個(gè)方法(事件)。

希望本文所述對(duì)大家的asp.net程序設(shè)計(jì)有所幫助。

您可能感興趣的文章: