我记得看到一个教程,介绍如何以更“可用”的方式来编写输入表单.
基本上,你有一个占位符的价值,当你输入的输入,它隐藏的提示说话.
现在,只是为了清楚:我不希望提示(占位符价值文本)在焦点上消失,而是当我第一次开始打字时要更轻.好的例子:
>查看表格Aardvark.这正是我希望有我的输入表单.
>我们自己的堆栈溢出 – 当您尝试提出问题时,单击任何输入表单,它不会立即隐藏文本.你看到你的光标和提示.但是当你开始输入时,它隐藏了提示. (我喜欢让它去一个更浅的阴影,而不是一起隐藏在一起,就像上面的Aardvark的例子.)
我记得非常清楚地阅读了interwebz这个确切要求的某个地方的教程,但是,我忘了把它加入书签.
任何建议/链接?
[更新:我最近发现一个jQuery插件In-Field Labels,正是我想要的.另外,here’s the link改进了同样的插件. ]
解决方法
你可能想从这开始:
<input type="text" value="Your Hint Here" onFocus="if (this.value == 'Your Hint Here') this.style.color = '#ccc';" onKeyDown="if (this.value == 'Your Hint Here') { this.value = ''; this.style.color = '#000'; }">
您应该可以调整以上使用JavaScript函数的方式不要重复你的提示字符串三次,但我希望这可以让你走正确的方向.
我也注意到,vark.com的“Join Now”表单也将光标位置设置为文本框的开头,而不是将其留在最后.这可能会使其跨浏览器工作有点棘手,但您可能需要检查Josh Stodola中以下文章中提出的解决方案:
> Setting Cursor Position in a Textbox or TextArea with Javascript