Я пытаюсь интегрировать загружаемый файл blueimp jquery в мой сайт, и, хотя в работе много работы, есть еще одна проблема. Загрузка файла запускается, когда я бросаю файл в любую часть экрана браузера, но в этом конкретном случае я хочу, чтобы это произошло, когда я бросал файлы в div.blueimp jQuery Загрузка файла в div
Мой код до сих пор это:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>jQuery File Upload Example</title>
</head>
<body>
<style>
.bar {
height: 18px;
background: green;
}
</style>
<div id="progress">
<div class="bar" style="width: 0%;"></div>
</div>
<form class="fileupload" action="upload.asp">
<div style="position:relative;border:1px solid black;height:200px;">
<h1>Drag file(s) into here or click Choose Files
</div>
<input id="fileupload" type="file" name="file1" data-url="upload.asp" multiple>
</form>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/vendor/jquery.ui.widget.js"></script>
<script src="js/jquery.iframe-transport.js"></script>
<script src="js/jquery.fileupload.js"></script>
<script>
$(document).bind('drop dragover', function (e) {
e.preventDefault();
});
$('#fileupload').fileupload({
/* ... */
progressall: function (e, data) {
var progress = parseInt(data.loaded/data.total * 100, 10);
$('#progress .bar').css(
'width',
progress + '%'
);
if (progress==100) {
alert('All done');
$('#progress .bar').css('width', '0%');
}
}
});
</script>
</body>
</html>
Я попытался сделать следовать инструкциям на этой странице:
https://github.com/blueimp/jQuery-File-Upload/wiki/Multiple-File-Upload-Widgets-on-the-same-page
Это говорит о том, что делает изменения в файл main.js но поскольку я использую базовую версию, я не использую этот файл (я думаю).
Надеюсь, кто-то может помочь!
Большое спасибо
Ed