我记得在某个地方看到过一个教程,该教程讨论了如何以一种更“可用”的方式设置输入表单的样式。
本质上,您有一个占位符值,当您输入输入时,它会隐藏提示。
现在,请澄清一下:我不希望提示(占位符值文本)消失在焦点上,而是在我第一次开始键入内容时变得更轻松。很好的例子:
我记得很清楚地阅读过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上的“立即加入”表单还将光标位置设置为文本框的开始,而不是将其保留在末尾。要使其跨浏览器工作可能有些棘手,但您可能需要检查Josh Stodola在以下文章中提出的解决方案: