html - iOS 更新到 10.3.1 破坏了 HTML 输入元素

Question

我们有一个现场主要由 iPad 使用的网站(不是应用程序，大小适合在 iPad 上使用)，显然刚刚发布的更新导致输入问题。我们有一个 HTML 输入，用于允许他们从保存的图片中进行选择:

        <input class="fileInput" type="file" name="file" accept="image/*" capture>

现在它只打开相机而没有使用滚动的选项。这是别人看到的吗？有解决方法吗？

谢谢， 詹姆斯

Answer 1

它只打开相机，因为你使用 bool 属性 capture .根据HTML Media Capture specification :

The capture...if specified, indicates that the capture of media directly from the device's environment using a media capture mechanism is preferred. When the capture attribute is specified, the user agent should invoke a file picker of the specific capture control type.

In this specification, the term capture control type refers to a specialized type of a file picker control that is optimized, for the user, for directly capturing media of a MIME type specified by the accept attribute, using a media capture mechanism.

The term media capture mechanism refers to a device's local media capture device, such as a camera or microphone.

对于您的情况，最好使用 <input>没有capture , 根据 HTML specification ，似乎提供选项是一种常见的浏览器行为:

User agents may use the value of this attribute (accept) to display a more appropriate user interface than a generic file picker. For instance, given the value image/*, a user agent could offer the user the option of using a local camera or selecting a photograph from their photo collection;

3年前有一个关于这个“文件输入控制”行为的讨论:HTML file input control with capture and accept attributes works wrong?可以看到“捕获属性存在时显示选项对话框”让人一头雾水。

在我看来，iOS 10.3.1 中的这一变化是对文件输入控制的修复。否则，有或没有 capture 都没有区别。属性。