IE不会使用类型文件的元素触发更改事件

时间:2016-11-03 22:31:05

标签: javascript jquery html internet-explorer file-upload

我在文件元素'profileSelectedFile'上有一个更改事件,在Chrome中它在我第一次选择文件(它被触发)时工作正常,但如果我在IE中运行它,则不会触发更改事件第一次。在我触发更改事件之前,我必须运行它两次。这是IE的错误吗?

我认为IE可能存在隐藏元素的问题,Chrome可能没有这个问题。

仅供参考 - 我打开一个显示不同上传类型的模式(例如FB,PC,Instagram),如果点击uploadFromPC按钮我关闭模态并打开文件上载窗口。

$('#profilePictureUpload').on('click', function() {
  $('#modalContainer').load(scope.enumControllers.getUploadModal, function(response, status, xhr) {
    $('#uploadModal').modal('show');
    $('.uploadFromPc').click(function() {
      $('#uploadModal').on('hidden.bs.modal', function(e) {
        var control = $("#profileSelectedFile");
        control.replaceWith(control = control.clone(true));
        document.getElementById('profileSelectedFile').click();

        $("#profileSelectedFile").change(function() {
          // doesn't get triggered in IE on first file upload event, only second upload triggers this event!
        });
      });
      $('#uploadModal').modal('hide');
    });
  });
});
<input type="file" style="display: none;" id="profileSelectedFile" src="" />
<input type="button" value="Upload a photo" class="btn btn-lg btn-default" id="profilePictureUpload" style="border: 1px solid lightgrey; font-weight: bold">

更新 - 我在下面尝试了这段代码,但它仍然只在我第二次在fileupload窗口中选择文件时触发'someFunction'

var someFunction = function () {
                            // what you actually want to do
                            var i = 0;
                        };

                        if ($.browser.MSIE) {
                            // IE suspends timeouts until after the file dialog closes
                            $input.click(function (event) {
                                setTimeout(function () {
                                    if ($input.val().length > 0) {
                                        someFunction();
                                    }
                                }, 0);
                            });
                        }
                        else {
                            // All other browsers behave
                            $input.change(someFunction);
                        }

0 个答案:

没有答案