Question

在ASP.NET MVC中实现水印文本框控件的最简单方法是什么，互联网上是否有任何此类控件（可能是codeplex）。我想编写一个扩展HtmlHelper并使用jquery水印文本框实现非常简单。

Answer 1

您可以使用如下的Jquery插件：

Watermark Plugin

提供了一个样本并且使用简单。

Answer 2

我会用这个：http://digitalbush.com/projects/watermark-input-plugin/

Answer 3

在此处使用我的Mvc Controls工具包的TypedTextBox：http://mvccontrolstoolkit.codeplex.com/wikipage?title=TypedTextBox

Answer 4

我使用并推荐ClearField jQuery插件：http://labs.thesedays.com/projects/jquery/clearfield/

使用起来非常简单，如此处所示（从上面的链接复制和粘贴）：

将它放在HTML页面标题中：

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.clearfield.js"></script>

在页面的某处添加此功能：

$(document).ready(function() {
    $('.clearField').clearField();
});

您的输入字段可能如下所示：

<input type="text" class="clearField" value="What's your name?" />

如果您使用的是ASP.NET（而不是MVC），那么您可能正在使用这样的ASP控件：

<asp:TextBox ID="Search" runat="server" CssClass="clearField">Search Something</asp:TextBox>

对于它说“在页面上某处添加此功能”的部分，您需要确保它在脚本标记中，如下所示：

<script type="text/javascript">
    $(document).ready(function () {
        $('.clearField').clearField();
    });
</script>

Answer 5

检查我的here

使用此jquery，您可以在文本框中显示水印。我在使用图像代替水印。您需要创建水印文本的图像。

$(document).ready(function () {

            /*Watermark for date fields*/

             if ($("#dob").val() == "") {
                $("#dob").css("background", "#ebebeb url('/Content/images/DateWaterMark.png') no-repeat 1px 0px");
            }

            $("#dob").focus(function () {
                if (watermark == 'MM/DD/YYYY') {
                    $("#dob").css("background-image", "none");
                    $("#dob").css("background-color", "#fff");
                }
            }).blur(function () {
                if (this.value == "") {
                    $("#dob").css("background", "#ebebeb url('/Content/images/DateWaterMark.png') no-repeat 1px 0px");
                }
            });

            $("#dob").change(function () {
                if (this.value.length > 0) {
                    $("#dob").css("background", "#fff");
                }
            });
}

Answer 6

您可以使用AJAX Control Tookkit Watermark控件。

ASP.NET MVC中的水印TextBox

6 个答案: