20

I have an ASP.NET 3.5 application and I'd like to add the type="email" according to HTML5 standards but if I add the type on the ASP:TextBox control I get the below output:

<input name="ctl00$content$txtEmailAddress" type="text" type="email" value="" 
id="ctl00_content_txtEmailAddress" class="input-block-level" required="required"/>

How can I replace the type attribute from "text" to "email"?

4

6 回答 6

38

如果您使用 .Net 3.5，那么无论您使用什么类型指定<asp:TextBox>，它都将始终使用 .Net 渲染<input type="text" />。因此，在这种情况下，您可以使用 type="email" 的简单 html 输入

<input type="email" />

对于 4.5 版本，您可以使用TextMode="Email"

<asp:TextBox ID="txtmyBox" runat="server" TextMode="Email"></asp:TextBox>
于 2013-06-04T09:31:14.183 回答
5

抱歉，我参加聚会有点晚了，尽管我认为其他人可以从我的所作所为中受益。我有一个 HTML 5 页面，尽管我们仍然有 .NET 3.5。我们希望保留 .NET 元素，但将类型更改为电子邮件。

我尝试了几种方法，但对我有用的方法如下：我在元素本身内联添加了一个 JavaScript 属性（当我将它放在脚本标记中时，由于某种原因它不会拾取......）

如果您使用我的更改，您的标签将如下所示：

<asp:TextBox runat="server" type="email" onfocus="this.type='email'"/>
于 2015-09-25T15:06:48.357 回答
0

可以这样用。。

 <asp:TextBox runat="server" type="email" />

新语法允许您定义与 HTML5 兼容的 TextBox 控件。例如，以下代码定义了一个与 HTML5 兼容的 TextBox 控件：

<asp:TextBox runat="server" type="some-HTML5-type" />

您可以参考此链接http://support.microsoft.com/kb/2468871并转到功能 3。

于 2013-11-19T04:56:55.737 回答
0

在旧版本的 .NET 中，您可以扩展TextBox该类以设置输入类型：

一个完全基本但有效的解决方案可能如下所示，它还向文本框添加了一个占位符。

namespace Ux.Example{
    public class TextBox : System.Web.UI.WebControls.TextBox
    {
        public string PlaceHolder { get; set; }

        public string InputType { get; set; }

        protected override void OnInit(EventArgs e)
        {
            if (!string.IsNullOrWhiteSpace(PlaceHolder))
                Attributes.Add("placeholder", PlaceHolder);
            if (!string.IsNullOrWhiteSpace(InputType))
            {
                Attributes.Add("type", InputType);
            }
            base.OnLoad(e);
        }
    }
}

您还必须使用以下命令将文件包含在 aspx 文件中@Register：

<%@ Register TagPrefix="ux" Namespace="Ux.Example" Assembly="CHANGE_TO_CORRECT_NAME" %>

然后控件的实际用法是：

<ux:TextBox ID="Email" Visible="false" runat="server" PlaceHolder="enter e-mail address" InputType="email" />

我尚未测试TextMode使用该属性时会发生什么。它可能会造成一些破坏。

于 2015-08-03T10:08:50.897 回答
0

我的解决方案（未更新到 .Net 4.5）以这样的内联脚本结束，如果您检查呈现的 html 输入元素，元素 ID 是可见的。

<label class="input text">
    <asp:TextBox runat="server" CssClass="text" ID="EmailTextBox"></asp:TextBox>
    <script>
        document.getElementById("ctl00_ContentPlaceHolder_EmailTextBox").type = "email";
    </script>
</label>
于 2017-05-31T09:01:16.503 回答
0

如果您想显示电子邮件列表的预览取决于您输入的字符和您在浏览器中的电子邮件名称历史记录，您应该将元素 ID 的名称设置为“电子邮件”。但所有方法大多适用于 chrome：

<asp:TextBox ID="email" runat="server" CssClass="YourEmailCss"></asp:TextBox>

或者，如果您使用 HTML 标准元素：

<input id="email" type="email" name="email" />
于 2015-09-23T21:21:15.433 回答