Вы должны быть в состоянии открыть новое окно, когда происходит событие удаления.Ниже приведен полный пример.
Сначала у нас есть область загрузки файла и события, которые обрабатывают перетаскивание:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
<body>
<div id="fileUpload" style="height:200; width:200; border:1px solid #ddd;"><span id="lbl">Drag and drop file here...</span></div>
<script>
$(function() {
$('#fileUpload').get(0).addEventListener("drop", upload, false);
$('#fileUpload').get(0).addEventListener("dragenter", noopHandler, false);
$('#fileUpload').get(0).addEventListener("dragexit", noopHandler, false);
$('#fileUpload').get(0).addEventListener("dragover", noopHandler, false);
function noopHandler(e) {
e.stopPropagation();
e.preventDefault();
}
function upload(e) {
e.stopPropagation();
e.preventDefault();
fileList = e.dataTransfer.files;
var fileCount = fileList.length;
// Only call the handler if 1 or more files was dropped.
if (fileCount > 0) {
window.open("upload.html");
}
}
});
</script>
</body>
</html>
Во всплывающем окне (upload.html),мы получаем файлы из родительского окна и начинаем загрузку:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
<body>
<script>
$(function() {
var fileList = window.opener.fileList;
var reader = new FileReader();
reader.onloadend = function(e) { alert("Uploaded"); }
for (file in fileList) {
// Upload
reader.readAsDataURL(fileList[file]);
}
});
</script>
</body>
</html>
Попробуйте и, надеюсь, это поможет решить проблему.