为什么浏览器控制输入类型文件按钮?

why do browsers control the input type file button?

我很好奇为什么不同的浏览器有不同的 <input type="file"> 按钮来浏览文件。有很多问题询问如何设置它们的样式,显然某种 "hacks" 用于改变它们。但是没有人真正解释为什么浏览器会控制它?

还记得只有一个浏览器的时候吗?如果样式中没有使用字体,浏览器必须设置默认字体。不仅字体有默认值,按钮也有默认值。即使不使用样式,也需要显示元素。

随着时间的推移,出现了更多的浏览器,它们可能具有相同的默认字体,但没有,它们想要彼此区分。

想象一下,开发人员忘记设置按钮的样式并且按钮没有默认值。 <input> 会是什么样子?表格下方浮动的文本?那不是很美观。

回到问题:文件输入按钮。它最初被赋予了一个固定的名称,而当前的浏览器只是继续最初实施的内容。随着时间的推移,人们已经习惯了他们在浏览器中看到的文件上传文本。就像下面的参考资料说的,有些人,比如老人或不擅长电脑(不限于),不使用其他浏览器的人,看到另一串文字可能会感到困惑。

参考:Change default text in input type="file"?

所以说控制力有点太强了。回退听起来好多了。 :)

AS @cweitat 已经指出,这可以追溯到 HTML 和浏览器(您还记得马赛克浏览器吗?)的早期阶段。

当时页面数据与浏览器之间的交互仅限于 HTML 语法和语义。没有 javascript 修改可用。

然而,支持将文件(浏览器本地)上传到服务器(为页面提供服务)的需求已被广泛接受。要走的路是为此目的提供一个版本的 button 逻辑。按钮是一种 HTML 元素,允许 activity 来自浏览器端(链接除外)。

当时页面上的元素显示在 "widgets" 没有想到的地方,因此可能没有人考虑在 HTML 元素上提供足够的设置来影响所涉​​及的所有视觉和交互方面带有用于选择和上传文件的小部件。

随着后来标准化 DOM 作为 "the page" 的表示和 javascript 作为以编程方式修改各个方面的机制,"users" 也尝试了也就不足为奇了越来越多地控制此类按钮的样式和视觉表示。

另一方面,如今影响页面表示的可能性越来越大(并且几乎呈爆炸式增长),也减轻了 "extending" 当前 HTML 元素语法的压力。 (我看到很多网页避免使用大多数标准 HTML 元素,转而使用 div 和一些 javascript。)

所以浏览器控件 <input type="file"/>,因为它们必须提供此元素的合适表示。由于没有关于必须遵循此元素的实现的内部表示的规范,但是有一些替代方法可以在不使用此类元素的情况下获得功能,因此浏览器供应商不太可能为页面开发人员公开内部状态 fiddle 与(并且这种方式允许更多控制)。

与其他按钮相比,文件输入按钮的视觉表示是一组不同的视觉组件。一个是按钮本身。另一个是显示所选文件的字段。此外(至少在逻辑上)弹出 window 显示可用文件,可能一些过滤器逻辑和更多按钮也是该功能的一部分。 (即使后面的部分通常是从window或操作系统环境中引入的,但这是一个实现细节。)

现在仅 HTML 元素不允许指定足够详细的样式。例如。指定背景颜色:这应该应用于按钮元素还是应用于反馈区域(所选文件),或者甚至应用于文件选择弹出窗口?浏览器开发人员本可以决定展示组件的一些内部结构,以供 "user. However, in formaer days it was not " 足够“有趣”,而今天您可能会使用其他机制。