我在文件元素'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);
}