Javascript 通过AJAX发送图像
我正在做我的拖放图像上传，但我有一个问题，通过ajax发送数据到php。因为当我发送数据时，它返回空数组。哪里会有问题 我的html+js=>Javascript 通过AJAX发送图像,javascript,ajax,drag-and-drop,Javascript,Ajax,Drag And Drop,我正在做我的拖放图像上传，但我有一个问题，通过ajax发送数据到php。因为当我发送数据时，它返回空数组。哪里会有问题 我的html+js=> 我的php=>print\u r（$\u POST）我不使用jquery，所以我添加了xhr2函数，只是为了向您展示它如何在纯javascript中使用新方法工作 作为u使用的Drop处理程序，它是prolly Irrievant，而且在任何情况下，它都是为现代浏览器而设计的 在我的例子中，ajax响应是使用console.log记录的 <!doc
我的php=>
print\u r（$\u POST）我不使用jquery，所以我添加了xhr2函数，只是为了向您展示它如何在纯javascript中使用新方法工作
作为u使用的Drop处理程序，它是prolly Irrievant，而且在任何情况下，它都是为现代浏览器而设计的
在我的例子中，ajax响应是使用console.log记录的
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
#drop{
width:150px;height:150px;
background-color:pink;
}
</style>
</head>
<script>
var x=function(a,b,e,d,c){c=new XMLHttpRequest;c.open((e?e:'get'),a);c.onload=b;c.send((d?d:null))},//url,func,method,formdata
handleFileSelect=function(evt){
evt.stopPropagation();
evt.preventDefault();
var files = evt.dataTransfer.files; // FileList object.
var fd=new FormData();
var output = [];
for (var i = 0, f; f = files[i]; i++) {
fd.append('file[]',f);
output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ',
f.size, ' bytes, last modified: ',
f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
'</li>');
}
x('http://localhost/zoznamka/user/upload/',function(){console.log(this.response)},'post',fd);
document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
},
handleDragOver=function(evt) {
evt.stopPropagation();
evt.preventDefault();
evt.dataTransfer.dropEffect = 'copy'; // Explicitly show this is a copy.
};
window.onload=function(){
var dropZone = document.getElementById('drop');
dropZone.addEventListener('dragover', handleDragOver, false);
dropZone.addEventListener('drop', handleFileSelect, false);
}
</script>
<body>
<div id="drop"></div>
<div id="list"></div>
</body>
</html>
当你发送文件时，你需要写
<?php
print_r($_POST);
print_r($_FILES);
?>
附言。。我还建议使用document.createDocumentFragment（）用于创建列表我不使用jquery，所以我添加了xhr2函数，只是为了向您展示它如何在纯javascript中使用新方法工作
作为u使用的Drop处理程序，它是prolly Irrievant，而且在任何情况下，它都是为现代浏览器而设计的
在我的例子中，ajax响应是使用console.log记录的
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
#drop{
width:150px;height:150px;
background-color:pink;
}
</style>
</head>
<script>
var x=function(a,b,e,d,c){c=new XMLHttpRequest;c.open((e?e:'get'),a);c.onload=b;c.send((d?d:null))},//url,func,method,formdata
handleFileSelect=function(evt){
evt.stopPropagation();
evt.preventDefault();
var files = evt.dataTransfer.files; // FileList object.
var fd=new FormData();
var output = [];
for (var i = 0, f; f = files[i]; i++) {
fd.append('file[]',f);
output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ',
f.size, ' bytes, last modified: ',
f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
'</li>');
}
x('http://localhost/zoznamka/user/upload/',function(){console.log(this.response)},'post',fd);
document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
},
handleDragOver=function(evt) {
evt.stopPropagation();
evt.preventDefault();
evt.dataTransfer.dropEffect = 'copy'; // Explicitly show this is a copy.
};
window.onload=function(){
var dropZone = document.getElementById('drop');
dropZone.addEventListener('dragover', handleDragOver, false);
dropZone.addEventListener('drop', handleFileSelect, false);
}
</script>
<body>
<div id="drop"></div>
<div id="list"></div>
</body>
</html>
当你发送文件时，你需要写
<?php
print_r($_POST);
print_r($_FILES);
?>
附言。。我还建议使用document.createDocumentFragment（）
用于创建列表使用new FormData（）&附加fie或将文件转换为base64对不起，我不明白。你能编辑我的代码吗？非常感谢。我不使用jquery。。。您需要使用jquery？使用new FormData（）&附加fie或将文件转换为Base64对不起，我不明白。你能编辑我的代码吗？非常感谢。我不使用jquery。。。您需要使用jquery？Uff。我认为更简单的解决方案是使用jQuery，我不使用jQuery。很慢。当您为现代浏览器编写代码时，它是不需要的。jquery是旧浏览器的一种多边形填充，它有时简化了代码，但大多数情况下它只是减慢了速度。我添加了xhr2函数uff。我认为更简单的解决方案是使用jQuery，我不使用jQuery。很慢。当您为现代浏览器编写代码时，它是不需要的。jquery是旧浏览器的一种多边形填充，它有时简化了代码，但大多数情况下它只是减慢了速度。我添加了xhr2函数