第一章、 Asp.net中服務端控件事件是如何觸發的javascript
Asp.net 中在客戶端觸發服務端事件分爲兩種狀況:
一. WebControls中的Button 和HtmlControls中的Type爲submit的HtmlInputButton
這兩種按鈕最終到客戶端的表現形式爲: <input name="Submit1" id="Submit1" type="submit" value=」Submit」>,這是Form表單的提交按鈕,點擊之後會做爲參數發送到服務端,參數是這樣的: 控件的name屬性=控件的value值,對應上面的例子就是:Submit1= Submit。 服務端會根據接收到的控件的name屬性的這個key來得知是這個按鈕被點擊了,從而在服務端觸發這個按鈕的點擊事件。
二. HtmlControls 中的 Type爲button的HtmlInputButton 和其它全部的控件事件,好比LinkButton點擊,TextBox的Change事件等等:
這些事件在客戶端產生後會通過一個統一的機制發送到服務端。
1. 首先asp.net頁框架會使用兩個Hidden域來存放表示是哪一個控件觸發的事件,以及事件的參數:
<!―表示觸發事件的控件,通常是這個控件的name -->
<input type="hidden" name="__EVENTTARGET" value="" />
<!―表示觸發事件的參數,通常是當某個控件有兩個以上的事件時,用來區別是哪一個事件 -->
<input type="hidden" name="__EVENTARGUMENT" value="" />
2. 服務端會生成一個jscript的方法來處理全部這些事件的發送,這段代碼是:
<script language="javascript">
<!--
function __doPostBack(eventTarget, eventArgument) {
var theform = document.WebForm2;
theform.__EVENTTARGET.value = eventTarget;
theform.__EVENTARGUMENT.value = eventArgument;
theform.submit();
}
// -->
</script>
3. 每一個會引起服務端事件的控件都會在響應的客戶端事件中調用上面的代碼:
好比,HtmlControls 中的 Type爲button的HtmlInputButton的點擊事件
<!―客戶端的點擊事件調用__doPostBack,eventTarget 參數爲'Button2',表示是name爲'Button2’控件觸發的事件,eventArgument 爲空,表示這個Type爲button的HtmlInputButton只有一個客戶端觸發的服務端事件-->
<input language="javascript" onclick="__doPostBack('Button2','')" name="Button2" id="Button2" type="button" value="Button" />
又好比,TextBox控件的Change事件
<!―客戶端的onchange事件調用__doPostBack,eventTarget 參數爲’TextBox1’,表示是name爲’TextBox1’控件觸發的事件,而TextBox控件只有一個客戶端觸發的服務端事件TextChanged,故服務器就會去觸發這個TextBox的TextChanged事件->
<input name="TextBox1" type="text" id="TextBox1" onchange="__doPostBack('TextBox1','')" language="javascript" />
4. 客戶端觸發事件後調用__doPostBack方法,將表示觸發的控件源的eventTarget 和事件參數eventArgument分別付給兩個隱藏域__EVENTTARGET和__EVENTARGUMENT,而後提交Form,在服務端根據__EVENTTARGET和__EVENTARGUMENT來判斷是哪一個控件的什麼事件觸發了。 java
第二章 PostBack的原理服務器
__doPostBack是一個純粹而且是很是簡單的javascript函數,大部分的頁面PostBack都是由它觸發的。注意,這裏是「大部分」,由於只有兩框架
個Web Server Control 會本身觸發頁面的PostBack,其它的因此控件都是經過__doPostBack函數觸發頁面的PostBack,那先來看一下這個函asp.net
數的定義吧: 函數
CODE1: this
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" /> spa
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" /> .net
function __doPostBack(eventTarget, eventArgument) { orm
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
經過上面的代碼能夠看到,__doPostBack帶有兩個參數,eventTarget是標識將要引起頁面PostBack的控件ID,eventArgument參數提供了在引起頁面PostBack事件時所帶的額外參數。固然這個函數被函數時,這兩個參數的值將賦值給頁面的兩個隱含變量__EVENTTARGET和__EVENTARGUMENT,而後調用頁面的submit方法提交頁面表單。這就是爲何咱們能夠經過Request.Form[「__EVENTTARGET」]獲取獲得引起頁面PostBack的控件ID的緣由。
瞭解了__doPostBack函數後,咱們能夠很容易的利用它很是方便地本身觸發自定義的PostBack事件。那上面也說了,大部分的控件都是調用
第三章 Button PostBack作法
引了頁面的PostBack,只有兩個控件是例外,Button 和 ImageButton,正是由於它們不是經過調用__doPostBack來回發事件,因此經過表單隱含變量__EVENTTARGET和__EVENTARGUMENT是沒法獲取獲得引起PostBack的Button或ImageButton的ID和參數值的,可經過下面的方式實現
1) 在頁面中加如 LinkButton ,頁面就會在頁面中加載POSTBACK所需的JS
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
2)利用GetPostBackEventReference給客戶端生成__doPostBack()
如:
好比前臺頁面
(1)
(2)
利用GetPostBackEventReference給客戶端生成__doPostBack()
前臺
後臺
經過__EVENTARGUMENT="haha"能夠判斷是否是點了那個連接的PostBack
把Button1的按鈕事件這麼寫: