描述:asp.net中服務器控件Button的點擊事件OnClientClick和OnClick的區別?
解答:http://www.cnblogs.com/ypfnet/archive/2012/12/24/2830771.html(作者:代號小子)
一、 二者的區別:
OnClick是button的服務器端事件
OnClientClick是button屬性,它里面執行的是js代碼,是在客戶端運行。
一般我們用 OnClientClick驗證我們的提交數據,但是這個一定要返回ture或者false,即一定要加上return,否則在客戶端驗證失效。如果是true那么就會執行后台的c#代碼,頁面也會進行提交刷新;否則就不執行,只會執行客戶端js代碼。
前台代碼:
1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="test.WebForm1" %> 2 3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 5 <html xmlns="http://www.w3.org/1999/xhtml"> 6 <head runat="server"> 7 <title></title> 8 <script type="text/javascript"> 9 function clickBtn() { 10 // alert("被點擊了!"); 11 // return false; 12 13 var yesORNo = confirm("確定點擊?"); 14 if (yesORNo) { 15 return true;//如果用戶點擊“確定”,就返回true,開始執行后台代碼! 16 } else { 17 return false; //如果用戶點擊“取消”,就返回false,不執行后台代碼! 18 } 19 } 20 </script> 21 </head> 22 <body> 23 <form id="form1" runat="server"> 24 <div> 25 <asp:Button runat="server" ID="btnok" Text="點擊" onclick="btnok_Click" OnClientClick="return clickBtn()"/><%--方法1:在控件中添加js代碼--%> 26 <asp:Button runat="server" ID="btnok2" Text="點擊2" onclick="btnok_Click" OnClientClick="return confirm('確定?')"/><%--方法2:在控件中添加js代碼--%> 27 </div> 28 </form> 29 </body> 30 </html>
后台代碼:
1 using System; 2 using System.Collections.Generic; 3 using System.Linq; 4 using System.Web; 5 using System.Web.UI; 6 using System.Web.UI.WebControls; 7 8 namespace test 9 { 10 public partial class WebForm1 : System.Web.UI.Page 11 { 12 protected void Page_Load(object sender, EventArgs e) 13 { 14 15 } 16 protected void btnok_Click(object sender, EventArgs e) 17 { 18 Response.Write("這里是后台,按鈕被點擊了"); 19 } 20 } 21 }
二、服務器控件調用js代碼
做網頁經常要和JavaScript打交道,經常要用JavaScript做一些客戶端的驗證,但是如果我們的按鈕用的是HTML控件的話,驗證通過后無法調用后台代碼,如果用服務器端控件,驗證不通過有要刷新頁面,這個有時候挺煩人的,能不能讓服務器端的按鈕調用客戶端的驗證,如果驗證成功后在調用服務器端的方法,這樣既減少了網路傳輸,給用戶感覺也好。
當我們用模板列做刪除數據的時候一般都會返回一個對話框詢問用戶是否確認,其實我們是通過修改模板列里的button的OnClientClick屬性將其值設為 return confirm("你確認刪除該條記錄嗎"); 我們可以分析一下,confirm返回的是個bool值,如果我的button返回的結果也是個bool應該也可以吧,我猜對了,比如有下面一些代碼 :
function judgeUserInput()
{
bool result = true;
if(驗證未通過)
{
result = false;
alert("請檢查您的輸入是否正確");
}
return result;
}