[ASP.NET] 在文字控制項上使用 HTML5 input type 的方法

Standard

最近的案件在製作手機版網頁時,其中有讓使用者輸入「手機」的欄位,這時想到若能善用 HTML5 文字框中 type 屬性,將之設為 tel,在智慧型手機上就能自動呼叫出電話數字鍵盤,那麼使用者輸入手機時會方便許多。

但由於是用 ASP.NET 3.5 製作,似乎在 4 之前的版本,文字框控制項尚不支援 HTML5 的眾多 type 屬性,若強制更改會造成編譯錯誤。
網上搜尋了一下解法,果真有相關的討論,其實做法就如同在文字框控制項加上 keydown 屬性一樣,在 code behind 那邊加上即可。

以本例來說,就會像這樣:

[code language=”csharp”]
this.txtPhone.Attributes.Remove("type");
this.txtPhone.Attributes.Add("type", "tel");
[/code]

成果圖:

一般的文字框輸入鍵盤

type 設成 tel 的電話輸入鍵盤

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *