Asp.Net 用戶端JS如何訪問服務端控制項的值？

Asp.Net 用戶端JS如何訪問服務端控制項的值？ 這是asp.net 初學者經常提出的問題。

Asp.Net 中有三種不同形式的控制項： html控制項、html服務端控制項、服務端控制項。

服務端控制項:服務端控制項的提出大大方便了程式員的編程工作，程式員可以在後台對這些控制項進行操作，或都將資料查詢結果輸出到用戶端。典形的服務端控制項有： TextBox控制項、DropDownList控制項、Button控制項、DataGridView控制項。DataGridView是一個資料輸出控制項，具有十分強大的功能，有了這個控制項，程式員可以不費吹灰之力，設計出複雜的表格輸出效果。（如果不採用DataGridView控制項，程式員單憑JS代碼，要實作類別似的功能，將十分的麻煩）。

html控制項:html控制項普通的HTML代碼，在web頁面提交時，這些HTML控制項的值可以提交到伺服器，伺服器端可以通過：string str = Request.Form["txtUserName"].Trim();等方式擷取HTML控制項的值。所以，服務端擷取用戶端html控制項的值是比較容易的事情（頁面必須提交到服務端）。

html服務端控制項：其實就是html控制項的基礎上加上runat="server"所構成的控制項.參考其他資料是這樣說的: 當ASP.NET 網頁執行時，會檢查標註有無runat 屬性，如果標註沒有設定，那麼Html標註就會被視為符串，並被送到字串流等待送到用戶端，用戶端的瀏覽器會對其進行解釋；如果Html標註有設定runat="server" 屬性，Page 對象會將該控制項放入控制器，伺服器端的代碼就能對其進行控制，等到控制執行完畢後再將Html伺服器控制項的執行結果轉換成Html標註，然後當成字串流發送到用戶端進行解釋< -- input id="Button" type="button" value="button" runat="server" />

我們的問題是：Asp.Net 用戶端JS如何訪問服務端控制項的值？

假設有一個服務端控制項 TextBox1 它的 ID 是：TextBox1，現在頁面內有一段JS代碼要獲了這個控制項的值，該怎以辦？

答案1：  var t1=document.all.TextBox1.value;（直接將服務端控制項當作用戶端控制項使用） 如果你幸運的話，這種方式會百試不爽。但是有一天，你突然發出錯了，“document.all.TextBox1.value對象為空白”你再也擷取不到TextBox1對應的值。

這個時候你查看一下網頁原始碼，你會發現有一個叫“ctl00_ContentPlaceHolderContent_TextBox1”（具體值視情況而定），實現上document.all.TextBox1.value是標準的js調用，它得到的是控個id 為“TextBox1”的值。現在源碼中的TextBox1的ID值變成了“ctl00_ContentPlaceHolderContent_TextBox1”，當然會錯了。

哪，之前為什麼我們可以調用成功呢？？？之前可以的啊！！！！

答案是：之間你是歪打正著，剛剛碰上的！！

對於“html服務端控制項”、“服務端控制項”，會首先在服務端進行處理，服務端根據控制項的內容產生一個或多個對應的“html控制項代碼字串”在這個過程中，伺服器會根據控制項的ID，產生一個新的ID當做新控制項的ID，為了避免與用戶端其它件衝突，新ID可能會與原ID不同，最後將這些產生的字串輸出給用戶端。（如果產生的新ID與原ID相同，用“var t1=document.all.TextBox1.value”方問就不會出錯了）。

哪麼在什麼情況下，產生的新ID會與原來的ID會不同呢？

1。TextBox1做為 DatagridView 的模板列輸出時。這時在可戶端可能產生多個對應的html控制項，所以新ID必須加一些首碼。

2。TextBox1位於模板頁的內部，因為不清楚模板外面是不是有ID與TextBox1相同的Html控制項，所以以了保險起見，必須在新ID前面加一些首碼。

…  … 其它情況………

“html服務端控制項”、“服務端控制項”都要經過用服端處理，所以都會存在上面的問題。

解決辦法：1。如果頁面相對比較簡單，服務端控制項ID與產生的用戶端控制項ID相同，那麼直接用：var t1=document.all.TextBox1.value就OK了。

2。如果產生的ID不同則：

a方法.在A.aspx頁面中引入一個全域變數來擷取ClientID,然後js指令檔可以調用該全域變數,如下:

<script language ="javascript">
var ddd = "<%=服務端控制項ID.ClientID%>";
</script>

b方法.將控制項本身以函數的參數的形式傳遞到js指令碼中去:

<asp:TextBox ID="tbUserName" runat="server" onblur="check(this);"></asp:TextBox>

然後在指令檔中可以直接調用:

function check(obj)
{
var name = obj.value;
}