AJAX文件上传到php，没有发送任何内容

AJAX file upload to php, nothing being sent?

本文关键字：任何内 文件 php AJAX      更新时间：2023-10-24

我的网站上有一个输入，允许用户选择一个文件上传

<input type="file" name="file" id="file" />

在我的页面末尾，我有一个按钮，它调用一个javascript函数。该函数需要检查用户是否指定了要上传的文件，如果指定了，则上传文件（php）并获取文件名。

如何从javascript访问文件输入表单？即，如何获取"post"文件信息以调用"upload_file.php"。

ps。我宁愿不使用JQuery

编辑-我试过这个，它似乎不起作用

function uploadFile(){
    var files = document.getElementById('file');
    var file = files.files[0];
    var xmlhttp=new XMLHttpRequest();
    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
        alert(xmlhttp.responseText);
        }
    }
    xmlhttp.open("POST","uploadfile.php",true);
    xmlhttp.setRequestHeader("Content-type", "multipart/form-data")
    var formData = new FormData();
    formData.append("thefile", file);
    xmlhttp.send(formData);
}

php:

<?php
echo "Upload: " . $_FILES["thefile"]["name"] . "<br />";
echo "Type: " . $_FILES["thefile"]["type"] . "<br />";
echo "Size: " . ($_FILES["thefile"]["size"] / 1024) . " Kb<br />";
echo "Temp file: " . $_FILES["thefile"]["tmp_name"] . "<br />";
?>

正在给我一个警告，说文件名为空，类型为空，大小为0等。

它可以通过DOM访问，就像任何其他元素一样。唯一的限制是，出于安全原因，您不能更改它。

http://www.simonerodriguez.com/ajax-form-submit-example/

请查看此链接以获取ajax文章。你们可以简单地把它贴成一个普通的表格，不需要额外的努力。

您是否考虑过HTML5文件API？

相关堆栈溢出：

Html 5文件上传

我认为您需要这样的东西：http://jsfiddle.net/kHQLp/4/

通过AJAX实现这一点有以下问题，因此可以实现（IE除外）。

1） 这对IE来说是不可能的。如果有人找到了办法，就给我喊一声。我所做的只是以正常的方式提交表格并返回更新的页面。

2） 对于FF（如果内存适合Opera和Safari），以下片段适用于

var fileTag = document.getElementById('id for input element');
var file = fileTag.files[0];
// You can check the type here by checking the string file.type
var data = file.getAsBinary(); // Or getAsText()

3） 对于Chrome使用此代码

var fileTag = document.getElementById('id for input element');
var file = fileTag.files[0];
var reader = new FileReader();
reader.onload = function() { /* Use reader.result as it has loaded */  };
reader.onerror = function(e) { /*  and error occurred - handle it */ };
reader.readAsText(file); // I think there is also a function readAsBinary.

当你得到文件的内容后，你可以使用AJAX 发布它

通过替换解决了我的问题

    xmlhttp.setRequestHeader("Content-type", "multipart/form-data")

带有

     xmlhttp.setRequestHeader("enctype", "multipart/form-data")
相关文章：