c# - 文本框的文本覆盖

Question

如何为 .net c# 文本框添加说明性文本覆盖？

我想获得与此页面上的标题文本框相同的效果：

Answer 1

您可以使用JQuery来做到这一点：

样本：

$('#inputId').watermark('watermark you want to show');

或者你可以使用 javascript：

function watermark(inputId,text){
  var inputBox = document.getElementById(inputId);
    if (inputBox.value.length > 0){
      if (inputBox.value == text)
        inputBox.value = '';
    }
    else
      inputBox.value = text;
}

<input id="inputTextboxId" type="text" value="type here" onfocus="watermark('inputTextboxId','type here');" onblur="watermark('inputTextboxId','type here');" />

Answer 2

您可以使用 ajax TextBox Watermark 控件：

<ajaxToolkit:TextBoxWatermarkExtender ID="TBWE2" runat="server"
        TargetControlID="TextBox1"
        WatermarkText="Type First Name Here"
        WatermarkCssClass="watermarked" />

你可以从这里得到它

Answer 3

如果您使用 asp.net，则可以使用 Ajax-Control-Kit 中的 TextBoxWatermarkExtender

http://www.asp.net/ajaxlibrary/AjaxControlToolkitSampleSite/

---

它是一个扩展器，而不是文本框的替代品，像这样使用它：

<asp:textbox id="txtSalesEventNo" runat="server" CssClass="textbox" Width="30%" />
<act:TextBoxWatermarkExtender ID="wmSalesEventNo" TargetControlID="txtSalesEventNo" WatermarkText="Sales Event Number" WatermarkCssClass="watermarked_border" runat="server" />

Answer 4

你可能会喜欢这个解决方案

/* Full overlay */
$(function () {
    $('.full_overlay .content').hide();
    $('.full_overlay').mouseenter(function () {
        $(this).find('.content').stop(true, true).fadeIn('slow');
    }).mouseleave(function () {
        $(this).find('.content').stop(true, true).fadeOut('slow');
    })
});