Question

下面的代码经过测试，仅可以通过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
}
?>

拖放已发布的多部分/表单数据，但无法收到$ _FILES

0 个答案: