我正在尝试使用占位符属性,但我注意到如果我将字段集中在Chrome上,占位符就会消失,在Firefox中它只会在第一次keydown之后消失。
我喜欢Firefox的行为:我如何强制Chrome以同样的方式行事?
非常感谢
答案 0 :(得分:3)
specification州(强调我的) -
用户代理应该在拥有后向用户显示此提示 当元素的值为空时,剥离的线会从中断 字符串或控件未集中(或两者),例如通过显示它 在一个空白的未聚焦控件内,否则隐藏它。
这意味着浏览器可以实现上述方法。要偏离浏览器默认行为,您可能必须编写一个自定义JavaScript解决方案,该解决方案将具有on keyup事件处理程序并将输入值与空字符串进行比较。
我个人会在输入上使用data-placeholder属性来实现它,以保存值。
尽管如此,Chrome似乎已经改变了Chrome Canary和Chrome 31(当前版本)的默认行为,在用户开始输入JS Fiddle I链接之前,占位符值仍然可见。
此行为仅在浏览器的“桌面”版本上进行测试,并且仅在Windows操作系统上进行测试。即使使用相同的浏览器,其他平台也可能存在一些差异。
Chrome自动更新,实际上相对难以防止这种情况发生,因此您的许多用户极不可能使用与Chrome 14(2011年9月发布)一样旧的版本。一般来说,根据我的经验,统计数据会显示正在使用的Chrome版本在最后三个版本之间划分,通常主要是当前版本和之前版本(比率取决于自上次发布以来的时间)。
因此,您的问题似乎不太可能影响许多(如果有)用户。
请注意specification中的以下内容 -
注意:使用占位符属性作为标签的替代品 可以降低范围控制的可访问性和可用性 包括老年用户和具有认知,移动性的用户的用户 精细运动技能或视力障碍。虽然给出了暗示 控件的标签始终显示,提示中的短提示 占位符属性仅在用户输入值之前显示。 此外,占位符文本可能会被误认为是预填充值, 并且通常实现占位符文本的默认颜色 提供不充分的对比度和缺乏单独的可见 label减小了可用于设置焦点的命中区域的大小 在控制上。
请不要使用占位符作为标签的替代品,或者至少为了辅助功能而使用隐藏标签(如您引用的Google示例中所示)。