Question

我有html格式：

<form enctype="multipart/form-data" id="formUpload">
<input type="file" name="file" />
<button type="submit" id="sub">Click</button>
</form>

我的剧本：

 $(function() {
        $("#sub").on("click",function () {
            var form = $("#formUpload")[0];
            var formData = new FormData(form);
            $.ajax({
                url: 'upload.php',
                data: formData,
                type: 'POST',
                contentType: false,
                processData: false,
                dataType: 'html',
                success: function(data) {
                   $("#res").html(data);
                }
            });
        });
    });

我尝试在upload.php中上传文件，但一切都错了。我如何获得$ _FILES变量？

Answer 1

每次点击提交按钮，您的页面都会刷新，您将看不到此语句$("#res").html(data);的任何输出。使用event.preventDefault()方法可以防止首先提交表单。所以你的Javascript代码应该是这样的：

$(function() {
    $("#sub").on("click",function (event){
        event.preventDefault();
        var form = $("#formUpload")[0];
        var formData = new FormData(form);
        $.ajax({
            url: 'upload.php',
            data: formData,
            type: 'POST',
            contentType: false,
            processData: false,
            dataType: 'html',
            success: function(data) {
               $("#res").html(data);
            }
        });
    });
});

在后端 upload.php 页面中，您可以使用$_FILES访问上传的文件数据，如下所示：

<?php
    if(is_uploaded_file($_FILES['file']['tmp_name'])){
        $name = $_FILES['file']['name'];
        $type = $_FILES['file']['type'];
        $size = $_FILES['file']['size'];

        // ...

    }
?>

如何在jquery中使用FormData上传文件？

1 个答案: