html - Firefox 4 必需的输入表单红色边框/轮廓

Question

我最近开发了一个 HTML5 jQuery 插件，但在 FF4 测试版中删除必填字段上的红色边框时遇到了问题。

我注意到 FF 在必填字段中应用此边框/轮廓，并在设置值时将其删除。问题是我正在使用 value 属性来模拟旧浏览器中的占位符 attr。因此，我需要具有此功能的所有输入不显示红线。

您可以在 plugin here 的演示页面中看到问题

Answer 1

CSS 中提供了一些新的伪选择器，用于一些新的 HTML5 表单功能。您可能正在寻找 :invalid。以下全部来自MDC Firefox 4 docs :

• :invalid CSS 伪类自动应用于内容根据输入类型设置验证失败的元素

• :-moz-submit-invalid 伪类是 应用于表单上的提交按钮 一个或多个表单字段时的字段 不验证。

• :required 伪类现在是自动的 应用于领域 指定所需的属性；这 :optional 伪类应用于 所有其他领域。

• :-moz-placeholder 伪类有 已添加，让您风格 表单字段中的占位符文本。

• :-moz-focusring 伪选择器 允许您指定一个外观 当 Gecko 相信 元素应该有一个焦点 指示呈现。