Question

我试过这样做，但它似乎不起作用。以下是我的代码。当文本框获得焦点时，颜色会变为黄色，但默认文本仍然存在。如果我清除文本并失去焦点，则文本框会以灰色文本显示“未定义”。最终我希望默认文本为灰色，焦点上的输入文本为黑色。此外，我想在焦点时更改文本框的背景颜色。任何建议将不胜感激。

HTML

<asp:TextBox ID="TextBox1" runat="server" value="Enter Last Name" onfocus="gotFocus(this)" onblur="lostFocus(this)" Width="175px" CssClass="textbox1"></asp:TextBox>

CSS

.textbox1 {
            color:gray;
        }

的Javascript

function gotFocus(obj)
{
    if (obj.value == obj.defaultvalue)
        obj.value = "";

    obj.style.color = "black";
    obj.style.backgroundColor = "yellow";
}

function lostFocus(obj)
{
    if (obj.value == "")
    {
        obj.value = obj.defaultvalue;
        obj.style.color = "gray";
    }

    obj.style.backgroundColor = "transparent";
}

Answer 1

这是一个轻松的家伙：

<asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True" placeholder="default value"  Width="175px"></asp:TextBox>

Answer 2

IE 10及以上

如果您不关心IE 9及以下版本，

占位符是一个不错的选择。

Can I use placeholder?

IE 8和9

如果您仍需要处理IE 8和9，您可能需要查看 -

AjaxControlToolKit's TextBoxWatermark

Answer 3

您可以使用CSS轻松完成，不要使用Javascript。

#TextBox1 { /* default style */
    color: grey;
}

#TextBox1:focus { /* style to apply on focus */
    color: black;
    background: /* some color */;
}

Answer 4

您可能不需要JS，您可以轻松完成您的要求。 CSS

#TextBox1{
    color:grey; //or any color you want
}
#TextBox1:focus{
    color:white;
    background-color:black;//any color you want
}

以下是fiddle

使用onfocus和onblur从asp文本框中删除默认文本

4 个答案:

IE 10及以上

IE 8和9