Question

我正在尝试上传文件输入更改的文件，但我无法让它工作，因为我对javascript不太好。

我在google上搜索过，发现了这个：How can I upload files asynchronously?

我使用它并尝试将其更改为我想要使用它的方式。但是我收到了错误

`Uncaught TypeError: Illegal invocation`

这是我的功能：

function uploadFile(formData){
    $.ajax({
        url: 'inc/ajax/uploadFile.php',  //Server script to process data
        type: 'POST',
        data: {'formData':formData},
        //Ajax events
        success: function(html){
            alert(html);
        }
    });
}

我这样称呼函数：

$("input:file").change(function(){
    var file = this.files[0];
    uploadFile(file);
})

并上传文件.php

<?php
 $formData = $_GET['formData'];
 echo $formData;
?>

我只是测试并尝试在php中返回文件以查看是否可以让它工作。但我不知道如何在PHP中调用它或使用AJAX发送它。我知道如何在PHP中检索$ _FILES后用PHP上传它。

Answer 1

您需要将数据作为FormData对象

发送

function uploadFile(file){
    var formData = new FormData();
    formData.append('formData', file);
    $.ajax({
        url: 'inc/ajax/uploadFile.php',  //Server script to process data
        type: 'POST',
        data: formData,
        //Ajax events
        success: function(html){
            alert(html);
        }
    });
}

http://blog.new-bamboo.co.uk/2012/01/10/ridiculously-simple-ajax-uploads-with-formdata

Answer 2

除了其他答案，请将此添加到您的ajax

contentType: false,
processData: false

像：

var formData = new FormData();
formData.append('formData', file);
$.ajax({
    url: 'inc/ajax/uploadFile.php',  //Server script to process data
    type: 'POST',
    data: formData,
    contentType: false,
    processData: false,
    //Ajax events
    success: function(html){
        alert(html);
    }
});

您还应该考虑可能没有更新浏览器的人，只需输入一些错误信息，例如：

if(window.FormData === undefined){
    alert('sorry buddy you\'re browsers too old!');
    return;
}

在更改文件输入时上传文件

2 个答案: