addEventListener / onchange在IE中不起作用

Question

我正在为Outlook开发一个JavaScript插件。

要使其在Outlook桌面上运行，我需要它在Internet Explorer 11.648上运行。 因为在Outlook Desktop中，底层浏览器是IE。

以下代码在chrome，firefox和Microsoft Edge中有效，但在IE 11中不起作用。

 "provide": {
        "ext-fileinfo": "*",
        "ext-pdo": "*",
        "ext-session": "*",
        "ext-iconv": "*",
        "ext-zip": "*"
    }

document.getElementById("upload_docu").addEventListener("change", function() {
  readURL(this);
}, false);


function readURL(input) {
  console.log("Read url called.");

  if (input.files && input.files[0]) {

    var reader = new FileReader();

    reader.onload = function(e) {
      $('.image-upload-wrap').hide();

      $('.file-upload-image').attr('src', e.target.result);
      $('.file-upload-content').show();

      $('.image-title').html(input.files[0].name);
    };

    reader.readAsDataURL(input.files[0]);
    file_name = input.files[0].name;
    var formData = new FormData();
    formData.append('document', input.files[0], input.files[0].name);
    console.log("Read url before url");

    var url = "https://dev.paksign.pk/api/v1/profile/" + localStorage.getItem('profile-uuid') + "/document/"

    $.ajax({
      url: url,
      type: 'post',
      headers: {
        'Authorization': 'JWT ' + localStorage.getItem("jwt_token")
      },
      data: formData,
      processData: false,
      contentType: false,
      success: function(data) {
        document_id = data.uuid;
        button = document.getElementById("upload_next");
        button.disabled = false;

      }
    });

  } else {
    removeUpload();
  }
}

其他选项

尝试了以下解决方案，它们在IE中也失败了。

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

<div class="file-upload">

  <div class="image-upload-wrap">
    <input class="file-upload-input" type='file' id="upload_docu" accept="" />
    <div class="drag-text">
      <h3>Drag and drop a file.</h3>
    </div>
  </div>

</div>