asp.net中给TextBox文本框添加水印,不影响正常使用

最新推荐文章于 2022-11-29 10:01:44 发布

我本良人

最新推荐文章于 2022-11-29 10:01:44 发布

阅读量2.7k

点赞数

分类专栏： asp.net

本文链接：https://blog.csdn.net/yangmingxing980/article/details/21941385

版权

asp.net 专栏收录该内容

49 篇文章 0 订阅

订阅专栏

具体代码如下：

<head id="Head1" runat="server">
    <title>填写备忘录信息</title>
    <script type="text/javascript">
        function watermark(id, value) {
            var obj = document.getElementById(id);
            obj.value = value;
            obj.style.cssText = "color:Gray";
            //获取焦点事件
            obj.onfocus = function () {
                this.style.cssText = "color:gainsboro";
                if (this.value == value) {
                    this.value = '';
                }
            };
            //失去焦点事件
            obj.onblur = function () {
                if (this.value == "") {
                    this.value = value;
                    this.style.cssText = "color:Gray";
                }
                else {
                    this.style.cssText = "color:gainsboro";
                }
            };
        }
        window.onload = function () {
            var arr = [{ 'id': 'TextBox1', 'desc': '请输入您的备忘录标题...' }, { 'id': 'TextBox2', 'desc': '请输入备忘录内容...'}];
            for (var i = 0; i < arr.length; i++) {
                watermark(arr[i].id, arr[i].desc);
            }
        };
    </script>
    <style type="text/css">
        .css1{
            width:500px;
            height:26px;
        }
        .css2{
            width:500px;
            height:270px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table style="width:500px;height:400px" align="center">
            <tr>
                <td style="width:500px;height:35px; font-weight: bold;" align="center">
                    填写备忘录信息
                </td>
            </tr>
            <tr>
                <td style="width:500px;height:30px;">
                    <asp:TextBox ID="TextBox1" runat="server" CssClass="css1"></asp:TextBox>

                </td>
            </tr>
            <tr>
                <td style="width:500px;height:270px">
                    <asp:TextBox ID="TextBox2" runat="server" CssClass="css2" TextMode="MultiLine"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td style="width:500px;height:30px" align="left">
                    <asp:CheckBox ID="CheckBox_Remind" runat="server" Text="邮件提醒" />
                </td>
            </tr>
            <tr>
                <td style="width:500px;height:35px" align="center">
                    <asp:Button ID="Button1" runat="server" Height="22px" Text="保存" Width="50px" />
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

我本良人

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
asp.net中给TextBox文本框添加水印,不影响正常使用

具体代码如下：填写备忘录信息 function watermark(id, value) { var obj = document.getElementById(id); obj.value = value; obj.style.cssText = "color:Gray";
复制链接

扫一扫

专栏目录