ASP.NET Web Pages - HTML 表單 · W3School C# & Asp.net 教程

# ASP.NET Web Pages - HTML 表單表單是 HTML 文檔中放置輸入控件（文本框、復選框、單選按鈕、下拉列表）的部分。 ## 創建一個 HTML 輸入頁面 ## Razor 實例 ``` <html> <body> @{ if (IsPost) { string companyname = Request["companyname"]; string contactname = Request["contactname"]; <p>You entered: <br /> Company Name: @companyname <br /> Contact Name: @contactname </p> } else { <form method="post" action=""> Company Name:<br /> <input type="text" name="CompanyName" value="" /><br /> Contact Name:<br /> <input type="text" name="ContactName" value="" /><br /><br /> <input type="submit" value="Submit" class="submit" /> </form> } } </body> </html> ``` [運行實例 ?](/try/showfile_c.php?filename=try_webpages_cs_009) ## Razor 實例 - 顯示圖像假設在您的圖像文件夾中有 3 張圖像，您想根據用戶的選擇動態地顯示圖像。這可以通過一段簡單的 Razor 代碼來實現。如果在您的網站的圖像文件夾中有一個名為 "Photo1.jpg" 的圖像，您可以使用 HTML 的 <img> 元素來顯示圖像，如下所示： <img src="images/Photo1.jpg" alt="Sample" /> 下面的例子演示了如何顯示用戶從下列列表中選擇的圖像： ## Razor 實例 ``` @{ var imagePath=""; if (Request["Choice"] != null) {imagePath="images/" + Request["Choice"];} } <!DOCTYPE html> <html> <body> <h1>Display Images</h1> <form method="post" action=""> I want to see: <select name="Choice"> <option value="Photo1.jpg">Photo 1</option> <option value="Photo2.jpg">Photo 2</option> <option value="Photo3.jpg">Photo 3</option> </select> <input type="submit" value="Submit" /> @if (imagePath != "") { <p> <img src="@imagePath" alt="Sample" /> </p> } </form> </body> </html> ``` [運行實例 ?](/try/showfile_c.php?filename=try_webpages_cs_010) ## 實例解釋服務器創建了一個叫 **imagePath** 的變量。 HTML 頁面有一個名為 **Choice** 的**下拉列表**（<select> 元素）。它允許用戶根據自己的意愿選擇一個名稱（如 **Photo 1**），當頁面被提交到 Web 服務器時，則傳遞了一個文件名（如 **Photo1.jpg**）。 Razor 代碼通過 **Request["Choice"]** 讀取 Choice 的值。如果通過代碼構建的圖像路徑（images/Photo1.jpg）有效，就把圖像路徑賦值給變量 **imagePath**。在 HTML 頁面中，<img> 元素用來顯示圖像。當頁面顯示時，src 屬性用來設置 imagePath 變量的值。 <img> 元素是在一個 if 塊中，這是為了防止顯示沒有名稱的圖像，比如頁面第一次被加載顯示的時候。