js动态设置asp:TextBox的默认显示的文字和文字颜色

最新推荐文章于 2024-10-12 10:52:00 发布

随风的Monkey

最新推荐文章于 2024-10-12 10:52:00 发布

阅读量5.7k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Asp.net

本文链接：https://blog.youkuaiyun.com/baidu_23966735/article/details/51747766

Asp.net 专栏收录该内容

6 篇文章

订阅专栏

本文介绍如何使用JavaScript动态设置ASP:TextBox控件的默认显示文字及其颜色。通过简单的脚本实现输入框聚焦时清除默认提示，失焦时恢复提示及颜色变化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

js动态设置asp:TextBox的默认显示的文字和文字颜色

在文件中添加：

<pre name="code" class="javascript"><script type="text/javascript">
    function addDefaultName(obj) {
        if (obj.value == "") {
            obj.value = "请输入用户名";
            document.getElementById("tbUserName").style = "color:#BEBEBE";//修改字体颜色
        }
    }
    function clearDafaultName(obj) {
        if (obj.value == "请输入用户名") {
            obj.value = "";
            document.getElementById("tbUserName").style = "color:#000000";
        }
    }
    function addDefaultPwd(obj) {
        if (obj.value == "") {
            obj.value = "请输入密码";
            document.getElementById("tbPassword").style = "color:#BEBEBE";
        }
    }
    function clearDafaultPwd(obj) {
        if (obj.value == "请输入密码") {
            obj.value = "";
            document.getElementById("tbPassword").style = "color:#000000";
        }
    }
</script>

在asp:TextBox中添加：

 <asp:TextBox ID="tbUserName" runat="server" onfocus="clearDafaultName(this)" onblur="addDefaultName(this)" style="color:#BEBEBE" Text="请输入用户名"></asp:TextBox>

 <asp:TextBox ID="tbPassword" runat="server" onfocus="clearDafaultPwd(this)" onblur="addDefaultPwd(this)" style="color:#BEBEBE" Text="请输入密码"></asp:TextBox>

此时鼠标放在输入框上有焦点时，文字消失，并且输入的文字为黑色

鼠标离开时，文字显示，文字颜色为灰色。