C# 與 JavaScript 互相呼叫完整方案

應用場景

在 ASP.NET WebForms 中，伺服器端 C# 程式碼與用戶端 JavaScript 常需雙向互動：JS 呼叫 C# 方法/存取變數，C# 執行 JS 函數/讀取 JS 變數。

JavaScript 呼叫 C# 方法

方法一：隱藏按鈕觸發 PostBack

頁面放置隱藏按鈕 (style="display:none")，JS 呼叫 document.getElementById("btnHidden").click() 觸發伺服器端 btnHidden_Click。

方法二：內嵌程式碼塊 (僅限初始渲染)

<script>
var result = "<%= GetServerData() %>"; // 頁面載入時執行
alert(result);
</script>

缺點：無法在 PostBack 後動態呼叫。

方法三：__doPostBack 手動觸發

function callServer(methodName) {
    __doPostBack(methodName, '');
}
// 伺服器端 Page_Load 判斷 Request["__EVENTTARGET"] 分派處理

方法四：隱藏欄位傳遞方法名

JS 設定 document.getElementById("hfMethod").value = "MethodName" 並 form.submit()，伺服器端讀取隱藏欄位決定執行邏輯。

JavaScript 存取 C# 變數

1. 隱藏欄位：<input type="hidden" runat="server" id="hfValue" />，C# 設定 hfValue.Value = "data"，JS 讀取 document.getElementById("hfValue").value。
2. 內嵌輸出：var jsVar = "<%= csharpVar %>"; (僅初始渲染)。
3. 註冊啟動腳本：ClientScript.RegisterStartupScript(GetType(), "key", "var temp = '" + value + "';", true);。

C# 存取 JavaScript 變數

1. 隱藏欄位回傳：JS 將值寫入 <input type="hidden" runat="server" />，C# 透過 Request.Form["id"] 取得。
2. Cookie/Session：JS 寫入 Cookie，C# 讀取 Request.Cookies；或 C# 寫入 Session，JS 透過 AJAX 取得。

C# 執行 JavaScript 函數

1. RegisterStartupScript：ClientScript.RegisterStartupScript(GetType(), "key", "alert('Hello');", true); 頁面載入後執行。
2. Literal 控制項：在 Literal 中輸出 <script>...</script> 並設定 Visible=true。

現代替代方案建議

WebForms 專案建議改用 AJAX (UpdatePanel、PageMethods、Web API、SignalR) 實現前後端分離通訊，避免上述傳統手法的維護困擾。