例項講解ASP.NET中伺服器控制元件和HTML控制元件

來源:酷知科普網 1.71W

asp.net的前身是asp技術,但是兩者還是有很明顯的區別的。我們學習asp.net一般是使用Visual studio 軟體來程式設計的,雖然說用IDE工具來程式設計程式碼會產生思考惰性,不過新人來說用IDE編碼比較容易。現在,我們來通過實際例子瞭解下ASP.NET中的伺服器控制元件和HTML控制元件吧。

例項講解ASP.NET中伺服器控制元件和HTML控制元件

操作方法

(01)新建網站雙擊桌面上的vs圖示,開啟軟體。點選選單欄中的【檔案】---【新建】---在彈出的【新建網站】中,選擇【.NET Framewordk 4】最高版本,【模板】選擇【Visual C#】,【ASP.NET空網站】,然後點選【確定】按鈕即可。

例項講解ASP.NET中伺服器控制元件和HTML控制元件 第2張

(02)新增新項點選 頁面右側的DVS檔案,在彈出的下來選單中選擇【新增新項】,然後點選【確定】。

例項講解ASP.NET中伺服器控制元件和HTML控制元件 第3張

(03)新增新項設定在彈出的視窗中,【模板】選擇【Visual C#】,【Web窗體】,然後輸入名稱,如【test】,點選【新增】按鈕即可。

例項講解ASP.NET中伺服器控制元件和HTML控制元件 第4張

(04)工具箱使用工具箱在前臺頁面輸入如下的控制元件程式碼:例項1:ASP.NET控制元件輸入當前日期時間<br /> <asp:TextBox ID="txt_1" runat="server"></asp:TextBox> <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />

例項講解ASP.NET中伺服器控制元件和HTML控制元件 第5張

(05)後臺程式碼然後在後臺輸入如下程式碼。指的是點選按鈕,在TextBox文字框控制元件中可以顯示當前的時間日期。要注意ASP.NET獲取值要用Text,而不能用Value。txt_1.Text = DateTime.Now.ToLongDateString();

例項講解ASP.NET中伺服器控制元件和HTML控制元件 第6張

(06)執行程式碼點選前臺中的【在瀏覽器中檢視】,或者直接使用快捷鍵Ctrl+Shift+W,在瀏覽器中預覽效果。

例項講解ASP.NET中伺服器控制元件和HTML控制元件 第7張
例項講解ASP.NET中伺服器控制元件和HTML控制元件 第8張

(07)把前臺的TextBox控制元件改為HTML型別的input控制元件,原先是沒有【runat="server"】把它補上。然後按鈕用ASP.NET型別的按鈕 <div> 例項2:HTML控制元件輸入當前日期時間 <br /> <input id="txt_2" type="text" runat="server"/> <asp:Button ID="Button2" runat="server" Text="Button" onclick="Button2_Click1" /> </div>

例項講解ASP.NET中伺服器控制元件和HTML控制元件 第9張

(08)後臺程式碼在後臺上輸入如下程式碼,其中因為是HTML控制元件,因此獲取控制元件值要用Value。 txt_2.Value = DateTime.Now.ToLongDateString();

例項講解ASP.NET中伺服器控制元件和HTML控制元件 第10張

(09)預覽效果然後在瀏覽器中預覽效果,可以看到ASP和HTML控制元件都可以獲取當前日期時間。

例項講解ASP.NET中伺服器控制元件和HTML控制元件 第11張

特別提示

(1)伺服器控制元件有runat=&quot;server&quot;,而HTML如果用到後臺的話要在控制元件中補上runat=&quot;server&quot;程式碼,相當於把它轉變成伺服器控制元件型別。<br/>(2)呼叫文字的方法不同:以本文使用的控制元件TextBox文字框為例,說明ASP.NET和HTML的呼叫不同之處:<br/>ASP.NET:TextBox.Text<br/>HTML :TextBox.Value<br/>(3)TextBox控制元件:文字框控制元件,作用是用於獲取使用者輸入的文字資訊。

熱門標籤