【问题标题】:Label for File input in firefoxFirefox中文件输入的标签
【发布时间】:2013-02-16 04:35:22
【问题描述】:

当我在表单输入中添加标签时,我通常可以单击该标签,它会将我引向适当的输入(见下文)。

<label for="input">Label</label><input type="text" id="input"/>

但是,当我尝试通过文件输入完成相同操作时,标签上的点击会被忽略。这是一个错误吗?一个特征”?有没有办法仍然做到这一点?

jsFiddle 测试用例:here

【问题讨论】:

  • 为我工作:OSX 上的 Chrome 14
  • 这在 FF6 上对我有用,但只能通过键盘导航 - 使用鼠标,它没有(假设它应该)正确聚焦文件输入。
  • 它在 Windows 7 上的 FF 7.0.1 中不起作用。
  • 它在 Windows 7 上的 FF 10.0.1 中不起作用。

标签: html file-upload


【解决方案1】:

标签的规定行为因 HTML 规范而异。

更准确地说,这可能是 FF 中的一个错误(而不是其他功能中的一个额外功能),因为根据 HTML 4 规范通常应该包含此行为: When a LABEL element receives focus, it passes the focus on to its associated control. See the section below on access keys for examples.

current HTML spec 更加细微,但确实表明它可能什么都不做(这是 iOS 中的预期行为)。

【讨论】:

  • 只是想指出,当人们引用 w3schools 时,我感到很难过……让我们说他们根本不可信。请看w3fools.com
  • +1 @MusikAnimal 令人惊讶的是,如此不准确的来源如此受欢迎(至少判断它们在谷歌搜索结果中的排名有多高)