我正在研究基本的拖放功能，它在其他浏览器中运行良好，但在 IE 11 中运行良好。我在另一个项目中使用 iframe 调用以下 html 代码。
它在没有 iframe 的情况下工作正常，但与 iframe 一起工作。任何人都可以为此提供解决方案吗？
提前致谢。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Upload</title>
<meta name="description" content="File Upload ">
<meta name="viewport" content="width=device-width">
</head>
<body>
<div class="container">
<table><tbody> <tr><td><span id="upload" >
<span>Upload</span><input id="fileupload" type="file" name="fileupload">
</span></td><td id="filename"></td><td id="percent" style="padding-left: 35px;"></td></tr>
</tbody>
</table>
</div>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script
src="https://raw.githubusercontent.com/blueimp/jQuery-File-Upload/master/js/vendor/jquery.ui.widget.js"></script>
<script
src="https://raw.githubusercontent.com/blueimp/jQuery-File-Upload/master/js/jquery.iframe-transport.js"></script>
<script
src="https://raw.githubusercontent.com/blueimp/jQuery-File-Upload/master/js/jquery.fileupload.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(document).bind('drop dragover', function(e) {
/* e.preventDefault(); */
});
if(typeof window.parent.fileid == 'undefined'){
window.parent.fileid = "";
}
var params = // some prams
$('#fileupload').fileupload({
dataType : 'json',
formData : params,
url : '${contextpath}/upload',
autoUpload: true,
});
$('#fileupload')
.bind('fileuploaddone', function (e, data) {
//uploaded successfully
}, 100);
}).bind('fileuploadfail', function (e, data) {
// upload is fail
})
});
</script>
</body>
</html>
最佳答案
我通过一些重新排列测试了您的代码，我注意到浏览器显示“您确定要离开此页面吗？”。您可以通过一些方式解决此问题，例如
- 您可以将浏览器兼容性从 IE11 更改为 IE10
- Yoy 需要设置 'forceIframeTransport: true' 选项以强制所有浏览器使用 iframe 传输模块进行文件上传并设置重定向选项以检索丢弃结果
你的文件上传功能应该是
$('#fileupload').fileupload({
dataType : 'json',
formData : params,
url : '${contextpath}/upload',
autoUpload: true,
forceIframeTransport: true,
'redirect',
});关于javascript - 通过 iframe 在 IE 11 中拖放文件不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50019605/