时间戳

首页 > 解决方案 > 拖放多部分/表单数据已发布但无法接收 $_FILES

javascript - 拖放多部分/表单数据已发布但无法接收 $_FILES

问题描述

下面的代码经过测试，仅使用 JavaScript 和 PHP 执行拖放操作。我收到了发布的数据，但 FILES 数组为空。

//Import jQuery CDN
<script src="script.js">
</script>

//Just for load body element     
<body></body>

<script type="text/javascript">        

//create a div area for drag & drop     

var dropbox = document.createElement('div');
dropbox.setAttribute('id','dropbox');
dropbox.setAttribute('style','margin-left:300px;margin-top:100px;border: 1px solid;width:760px;height:420px;background-image:url(bg.gif);');
document.body.insertBefore(dropbox,document.body.firstChild);

document.getElementById('dropbox').ondragover = function(event){
event.preventDefault();
}; 

document.getElementById('dropbox').ondragenter = function(event){
event.preventDefault();
};
document.getElementById('dropbox').ondragleave = function(event){
event.preventDefault();
};

document.getElementById('dropbox').ondrop = function(event){

事件阻止在动作发生之前执行，实际上 ondragover 将与 ondrop 发生冲突，但在这种情况下，我只是逃避其他未执行的事件

event.preventDefault();

var files = event.target.files || event.dataTransfer.files;    
var formData = new FormData();

//Receive file(s) as objects
for(var i=0;i<files.length;i++){
//Append to a form
formData.append('file_'+i,files[i]);
}

//Ajax POST to send data
$.ajax({
type : 'POST',
url :'process.php',
cache: false,
processData: false,
data : formData,
success:function(result){
alert(result);
},
failure:function(error){
alert('Failure...!');
}
});


};

</script>

<?php
//Receive POST files
if($_SERVER['REQUEST_METHOD'] == 'POST'){
print_r($_POST);    //Data received 
print_r($_FILES);    //Array is empty
}
?>

标签： javascriptphpjqueryfile-upload

解决方案

推荐阅读