深入學習JS: __doPostBack函數

在.NET中，所有的服務器控件提交到服務器的時候，都會調用__doPostBack這個函數，所以靈活運用這個函數對於我們的幫助還是很大的.

       比如，在我們寫程序的時候經常會需要動態的生成一些控件，最簡單的方法就是通過一個字符串,比如string strButton = <input type =”button” ID=”button1”>,然后輸出到頁面，但是如果我們需要這個控件來執行一些服務器的功能，就比較困難了.這里我們就可以用過借用__doPostBack這個函數來完成.接下來我覺個例子來說明一下具體如何調用.

   

       既然要在服務器端運行那么，我們可以聲明一個不可見的LinkButton控件，那通常，我們希望一個控件不可見，通常都是把visible屬性設為false.但是在這里我們把LinkButton的Text屬性設置為空，來是這個LinkButton不可見(為什么要這么設置，而不是直接設置visible屬性，我會在下面說明)，接下來我們可以在LinkButton里面寫一些服務器端的代碼.然后就是如何通過我們動態生成的客戶端控件來調用LinkButton里面的功能,我們可以通過一個JavaScript函數來實現

       function ExcuteOnServer()

       {

       //第一個參數是你希望提交到服務器的控件的ID號，第二個參數是事件參數

       __doPostBack('LinkButtonID','');

       }

       接下去我們只需要在動態生成的這個Button控件的onclick事件中寫上onclick=”JavaScript:ExcuteOnServer();"，這樣當我們點擊這個動態生成的客戶端控件的時候，他便會執行LinkButton中的代碼.

   

       這樣便實現了動態生成的客戶端控件提交到服務器端的功能.

       最后要說一下的就是為什么希望LinkButton控件不可見的時候，不是通過visible屬性來完成的.因為當我們把visible屬性設置為false的時候，瀏覽器在解析的時候，根本不會把這個控件放在頁面上，也就是說這個控件是不存在的，所以我們在調用__doPostBack函數的時候，便會找不到控件.

 

這里介紹一個常用的函數_doPostBack,這個函數如果如果是ASP.Net render出來的頁面就是自動產生這個函數，比如有帶autopostback屬性的控件，且其屬性為true的頁面，帶編輯列的datagrid頁面。

__doPostBack 是通過__EVENTTARGET,__EVENTARGUMENT兩個隱藏控件向服務端發送控制信息的，__EVENTTARGET為要調用控件的名 稱，如果要調用的控件是子控件，用''$'或':'分割父控件:子控件,__EVENTARGUMENT是調用事件時的參數

下面演示下如何調用后台事件：

1.新建工程

2.拖入一個服務端Button1,一個DropDownList1和一個客戶端Button

3.設置DropDownList1的AutoPostBack屬性為True,Button1的Visible為False

4.雙擊Button1，在事件里寫下Response.Write("hello:" );

5.頁面的HTML里找到客戶端Button，寫入onclick="__doPostBack('Button1','')"

6.編譯，運行，點擊Button是不是出現了"Hello"

7.查看源代碼，發現里面多了下面行

<script language="javascript"><!--function __doPostBack(eventTarget, eventArgument) {

var theform;

if (window.navigator.appName.toLowerCase().indexOf("netscape") > -1) {

              theform = document.forms["Form1"];

          }

else {

               theform = document.Form1;

           }

          theform.__EVENTTARGET.value = eventTarget.split("$").join(":");

           theform.__EVENTARGUMENT.value = eventArgument;

          theform.submit();

      }


</script><input type="hidden" value="" /><input type="hidden" value="" />