如何使用预先填写的"说明"创建一个HTML表单,该表单在用户点击框中时会清除？

Question

我有一个HTML表单:

   <form method="POST" action="http://">
 Username: <input type="text" name="username" size="15" />
 Password: <input type="password" name="password" size="15" />
<input type="submit" value="Login" />
 </div>
 </form>

我想要的是这样的功能,即文本字段中包含的指令在用户单击框中时会清除,这样我就可以节省空间并从表单外部删除用户名和密码.我怎样才能做到这一点？

Answer 1

您正在寻找的功能称为"占位符".(如果没有别的,只知道这个术语将帮助您在Google中搜索更多信息)

在支持HTML5的现代浏览器中,这是一个内置功能,您可以非常轻松地使用,如下所示:

<input type='text' name='username' size='15' placeholder='User name' />

但是,此方法仅适用于支持此功能的最新浏览器.

较旧的浏览器需要有一些Javascript代码才能完成.幸运的是,您可以使用许多脚本,包括一些编写为JQuery插件的脚本.我推荐的那些是placeholder与输入字段中的属性相关联的那些,因此您可以在具有此功能的浏览器中本地支持它,而对于那些不具有此功能的浏览器则可以回退到Javascript.

试试这个:http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html