我网站上的联系人-us HTML页面上的表单有两个字段
1)主题
2)消息
当页面第一次加载时,我希望这两个框显示" 在此输入主题 "和" 在此输入消息 "等消息.
我发现我们可以通过使用文本框的"value"属性来做到这一点,这是最好的方法吗??我有什么替代方法来实现这一目标?
哦,我真的需要完成关于这个主题的文章.这是未经抛光的版本:
首先 - 描述输入字段的内容的消息不是默认值.默认值是可以想象提交的内容(例如,基于GeoIP输入的国家/地区,或来自客户记录的交付地址).
第二 - 使用默认值作为假标签,然后在用户关注它时擦除它(可能是您不希望用户必须手动删除该消息)会导致可访问性问题.屏幕阅读器会读出所关注的内容,如果您在聚焦时将其删除,则无法获取信息.
的最佳选择,在我看来,是将一个<label>
旁边的控制.网页通常不会缩短空间 - 滚动条不是邪恶的.
如果你真的希望它看起来像是在控件中那么:
<label>
和<input>
放入<div>
<div>
使用JavaScript 设置一个类(所以你没有垃圾经验是JS不可用)<div>
to position: relative
并为其指定大小.background
的<input>
transparent
样式并填充divPosition
该<label>
下<input>
text-indent
为高负长度(例如-999em
),以便文本隐藏在屏幕外(但仍可供屏幕阅读器使用)