0
我嘗試創建簡單的「拖動&」文件上傳。這是我的代碼:
HTML(的index.html):
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="script.js"></script>
<form action="upload.php">
<div id="dropZone">
Drag File
</div>
</form>
的JavaScript(的script.js):
$(document).ready(function() {
var dropZone = $('#dropZone'),
maxFileSize = 1000000;
dropZone[0].ondrop = function(event) {
event.preventDefault();
dropZone.removeClass('hover');
dropZone.addClass('drop');
var file = event.dataTransfer.files[0];
if (file.size > maxFileSize) {
dropZone.text('Max size 1mb!');
dropZone.addClass('error');
return false;
}
var xhr = new XMLHttpRequest();
xhr.upload.addEventListener('progress', uploadProgress, false);
xhr.onreadystatechange = stateChange;
xhr.open('POST', 'upload.php');
xhr.setRequestHeader('X-FILE-NAME', file.name);
xhr.send(file);
alert(xhr.responseText);
};
function uploadProgress(event) {
var percent = parseInt(event.loaded/event.total * 100);
dropZone.text('Loading: ' + percent + '%');
}
function stateChange(event) {
if (event.target.readyState == 4) {
if (event.target.status == 200) {
dropZone.text('Ok!');
} else {
dropZone.text('Error!');
dropZone.addClass('error');
}
}
}
});
PHP(upload.php的):
<?php
$uploaddir = 'upload/';
$uploadfile = $uploaddir.basename($_FILES['file']['name']);
if (!$_FILES)
{
move_uploaded_file($_FILES['file']['tmp_name'], $uploadfile);
}
?>
我的問題是該文件無法上傳文件夾中,$ _FILES ['file'] ['tmp_name']爲空... 有沒有人有一個想法,我的mi賭注?
謝謝...
它沒有工作=( 我找到了解決辦法,錯誤是在javascript: VAR XHR =新的XMLHttpRequest(); xhr.upload.addEventListener('progress',uploadProgress,false); xhr.onreadystatechange = stateChange; var url =「http://localhost/up/upload/upload.php」; xhr.open('POST ',url,true); var formData = new FormData(); formData.append('file',file); xhr.onload = function(){('#dropZone')。html(xhr.responseText); } xhr.send(formData); – user3710480