如何显示asp.net文本框的默认文本[重复]答案

【问题标题】：How to display default text for asp.net textboxes [duplicate]如何显示asp.net文本框的默认文本[重复]
【发布时间】：2013-12-14 08:58:06
【问题描述】：

如何在页面加载期间为 asp 文本框设置默认文本并在关注时清除它们..

我知道使用 javascript 和 jquery 在 html 文本框中执行此操作..但是如何在 asp.net 中执行此操作..请提供任何帮助..

我写的

<asp:TextBox ID="Rloginemail" runat="server" Width="100%" Height="25px" 
     BackColor="#ECE8D0" BorderStyle="None" ForeColor="#482B1B" 
     Text="E-MAIL" >E-MAIL</asp:TextBox>

在上面的代码中你可以看到text=email..如果我使用这个默认文本会显示但没有在焦点上清除..

【问题讨论】：

你是指有水印之类的吗？
液蛇是什么意思..
你想给文本框加水印，不是吗？
或见How do I get placeholder text in firefox and other browsers that don't support the html5 tag option?。
但是所有这些答案都在文本框的左侧角落提出了提示，但我想在中间..这可能..

标签： c# asp.net .net

【解决方案1】：

使用OnFocus 事件并将Text 属性设置为空字符串

例子：

<asp:TextBox ID="Rloginemail" runat="server" Width="100%" Height="25px" BackColor="#ECE8D0" BorderStyle="None" ForeColor="#482B1B" Text="E-MAIL" onfocus="if (this.value == 'E-MAIL')  this.value = ''; ">E-MAIL</asp:TextBox>

或者，如this 答案中所述 - 您还可以使用名为 placeholder 的 asp.net 文本框属性：

        <asp:TextBox ID="Rloginemail" runat="server" Width="100%" Height="25px" 
                     BackColor="#ECE8D0" BorderStyle="None" ForeColor="#482B1B" 
                     placeholder="E-MAIL" ></asp:TextBox>

【讨论】：

"我知道在 html 文本框中使用 javascript 和 jquery 来做。但是如何在 asp.net 中做"
html 文本框不是 asp 文本框。你不能在纯 ASP.net 中这样做，因为它需要回发来处理。如果您有疑问，请查看其他解决方案
我知道纯粹通过 ASP.net 是不可能的，最接近的是使用 ajax 控制工具包，不是吗？

【解决方案2】：

HTML 5

可以使用placeholderhtml5属性

<input type="text" placeholder="search" />

jQuery 占位符插件

如果您的浏览器不支持，请使用jquery placeholder

$('input, textarea').placeholder()

【讨论】：

【解决方案3】：

在 asp.net 中，您可以使用 ajax 控制工具包来实现。我们有一个 TextboxExtender 除了下面的其他事情之外，它还可以做到这一点

<ajaxToolkit:TextBoxWatermarkExtender ID="TBE" runat="server"
TargetControlID="youTextBoxID"
WatermarkText="YOUR DEFAULT TEXT"
WatermarkCssClass="yourPreferred css" />

【讨论】：

【解决方案4】：

我们为此使用 Ajax Control Toolkit 的 Textbox Watermark 扩展器： http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/TextBoxWatermark/TextBoxWatermark.aspx

【讨论】：

【解决方案5】：

  $(document).ready(function () {
    $(":input[data-watermark]").each(function () {
        $(this).val($(this).attr("data-watermark"));
        $(this).css("color", "#a8a8a8");
        $(this).bind("focus", function () {
            if ($(this).val() == $(this).attr("data-watermark")) $(this).val('');
            $(this).css("color", "#000000");
        });
        $(this).bind("blur", function () {
            if ($(this).val() == '') {
                $(this).val($(this).attr("data-watermark"));
                $(this).css("color", "#a8a8a8");

            }
            else {
                $(this).css("color", "#000000");
            }
        });
    });
});

风格

<style>
.placeholder {
color: #a8a8a8;

}

::-webkit-input-placeholder {
color: #a8a8a8;

}

:-moz-placeholder {
color: #a8a8a8;

}

.home_textbox{width:155px; height:25px; border:1px solid #c9c5c1; border-radius:5px; position:relative; font-size:13px; color:#b5b0aa; font-family:"Myriad Pro"; padding:0 5px;}

文本框

<input type="text" name="TxtLogin" id="TxtLogin"
                            class="home_textbox" runat="server" tabindex="1" style="color:Black;" data-watermark="Username" />

【讨论】：

您可能想提及您从哪里复制它以及它的作用。
这也是纯粹的 html/jquery 方式 - 与 asp.net 无关。有趣的是，它是 OP 的正确答案
用户没有标记 jquery 并不意味着他不包含它。和 CodeCaster 我没有复制..我在我的项目中做了..所以请
见stackoverflow.com/questions/7433589/…。
您想要证明我已包含在我的项目中并从我的项目中复制粘贴它？

【解决方案6】：

您提到您可以使用 javascript 或 jQuery 为 html 文本框执行此操作，但不知道如何使用 Asp.Net 文本框执行此操作。正确的？是否只是因为您的 asp.net 文本框的 id 动态更改而您无法访问它？如果是，那么您可以使用以下代码访问 id：

document.getElementById("<%=textbox.ClientID%>")

您可以在用 aspx 代码编写的脚本中使用上面的代码来获取 asp.net 文本框，然后您可以使用 javascript/jQuery 进行操作。

【讨论】：