2

我正在创建一个网站，我的编码遇到了一个困境。

我正在写一个“提交表单”，我需要它看起来像下面的例子：

消息：（让用户提交消息或输入任何评论）在文本框中，我希望它说“在此处输入您的消息”，但是当您在框中单击时，“在此处输入您的消息” '消失。我也希望能够控制这个文本框的大小。姓名：在此处输入您的名字和姓氏（我希望其功能与上述相同） 电子邮件地址：在此处输入您的电子邮件地址：（再次，功能与上述相同）

这是我到目前为止的代码，对于我正在尝试做的事情，我不确定它是否正确：

<form method="post" action="mailto:youremail@youremail.com" >

<b>Message:</b><br><input type="textbox" value="text_name" onfocus="if (this.value=='Text_name') this.value='';" style="width: 300px;" style="height: 300px;"/><br/>

<b>Name:</b><br><input type="text" name="First and Last" size="30" maxlength="30" /><br />

<b>Email:</b><br><input type="text" name="Email" size="24" maxlength="24" /><br />

<input type="submit" value="Send Email" /> 

</form>
4

4 回答 4

2

有很多可用的插件。但是您可以使用 HTML5 属性“占位符”

<input type="text" placeholder="Enter your name...">

这是演示。当您开始输入时，文本/提示将消失。

<b>Message:</b><br><input type="textbox" placeholder="Type your message here"   style="width: 300px;" style="height: 300px;"/><br/>

<b>Name:</b><br><input type="text" name="First and Last" size="30" maxlength="30" placeholder="Type your first and last name here" /><br />

<b>Email:</b><br><input type="text" name="Email" size="24" maxlength="24" placeholder="Type your email address here"/><br />

<input type="submit" value="Send Email" />
于 2013-09-27T05:58:08.047 回答
0

我建议您使用引导 css 以获得更好的样式。看看这个http://getbootstrap.com/css/。我希望这对你有帮助

于 2013-09-27T06:03:25.173 回答
0

您可以定义一个脚本并使用以下函数，因为它可以用于onfocus和onblur,

function clearText(field) {
    if(field.defaultValue == field.value) {
        field.value = “”;
    }
    else
        if(field.value == “”) {
            field.value = field.defaultValue;
        }
}
于 2013-09-27T06:09:04.873 回答
0

据我了解，这几乎与以下内容重复：Onclick event to remove default value in a text input field right?

如果你对 HTML5 没问题，那么你可以使用占位符，否则你需要使用 Javascript 来删除文本onblur

于 2013-09-27T06:01:09.327 回答