时间戳

首页 > 解决方案 > 通过动态输入元素上传图像在 iOS 上不起作用

ios - 通过动态输入元素上传图像在 iOS 上不起作用

问题描述

我正在开发一个应用程序，用户可以在其中将图像上传到他们的个人资料。

当从子元素触发事件时，将调用以下函数。它动态创建一个输入元素，以便用户可以选择要上传的文件。

            _changeImage: function () {
                var input = document.createElement('input');
                input.type = 'file';
                input.accept = 'image/*';
                input.addEventListener('change', this._imgChanged.bind(this));
                input.click();
            },

它适用于浏览器和安卓平台，但在 iOS 上失败。

谁能指出可能导致此问题的原因以及我该如何解决？

标签： ioscordovapolymer-1.0

解决方案

此问题似乎与 iOS 中的安全措施有关。文件输入必须由用户手动单击，而不是以编程方式完成。

为了解决这个问题，我们在目标元素上覆盖了一个不可见的输入元素。

<input id="inputpic" type="file" accept="image/*" on-change="someFunction">

*请记住，on-change 是特定于聚合物的，因此您可能需要使用 onChange

然后我们用css设置它的不透明度为0。

       #inputpic {
            opacity: 0;
            position: absolute;
            top: [position_of_target_element];
            left: [position_of_target_element];
            width: [width_of_target_element]px;
            height: [width_of_target_element]px;
            z-index: 10;
        }

我对这种解决方法并不特别满意，但我尝试了其他几种建议的解决方案（下面的链接）并发现：

使用“隐藏”属性而不是 css 不透明度不起作用。

将输入元素包装在标签元素中不起作用。

此线程中的更多信息。

如果其他人有更好的解决方案，我很想听听。谢谢！

推荐阅读