ios 11.2.x 上的 ionic cordova 中的 Fire click 事件不起作用

Posted 2023-03-15

【中文标题】ios 11.2.x 上的 ionic cordova 中的 Fire click 事件不起作用

【英文标题】：Fire click event in ionic cordova on ios 11.2.x doesn't work

【发布时间】：2018-03-06 20:01:18

【问题描述】：

我有一个使用 ionic 的应用程序。 我有一个打开文件浏览器的按钮：

html 页面：

<input class="input-file" name="imgToUpload" id="imgToUpload" type="file"
         #imgToUpload  [(ngModel)]="message.file" (change)="onFileChange($event)" accept="image/gif, image/jpeg, image/png">
    <div ion-button block large (click)="openFileBrowser($event)" style="background-color:#39D2B4;">
      <ion-icon name="camera"></ion-icon>
    </div>

在我的 .ts 文件中，我有 openFileBrowser 方法：

openFileBrowser(event:any)
event.preventDefault();
let element : HTMLElement = document.getElementById('imgToUpload') as HTMLElement;
element.click();

在更新 ios 11.2.6 之前，这个方法被触发没有问题。 从 iOS 11.2.6 开始，click() 没有触发。

有人遇到过这个问题吗？ 我该如何解决？ 谢谢。

【参考方案1】：

我已经通过这种方式解决了，用 div 模拟按钮：

<div class="fileUpload" ion-button>
  <input class="upload" type="file" (change)="selectImagem($event)" multiple accept="image/*"/>
</div>

在css中，我隐藏了输入文件

.fileUpload 
    position: relative;
    overflow: hidden;
    background-color: transparent;
    color: #488aff;
    box-shadow: none;

    input.upload 
      position: absolute;
      top: 0;
      right: 0;
      margin: 0;
      padding: 0;
      font-size: 20px;
      cursor: pointer;
      opacity: 0;
      filter: alpha(opacity=0);