Ajax POST输入文件到PHP

时间:2015-08-23 13:23:14

标签: javascript php jquery html ajax

我试图将html输入文件发布到我的PHP文件,而不是使用传统的同步html表单。

我面临的问题是,我不认为我将输入文件正确地发送到我的PHP文件,因为我的PHP文件说它没有收到任何POST数据

HTML:

<form id="uploadForm">
    Begin by uploading a file (<5mb): <br> <br>
    <span class="btn btn-info btn-file" id="buttonColor">
        Browse... <span class="glyphicon glyphicon-folder-open"></span><input type="file" id="uploadBrowseBtn" name="uploadBrowseBtn" onchange='$("#upload-file-info").html($(this).val());'>
    </span>
    <br>
    <span class='label label-info' id="upload-file-info">Choose a file.</span>
    <br> <br>
    <input type="button" class="btn btn-info" id="uploadSubmitBtn" value="Upload">
</form>

JS:

$("#uploadSubmitBtn").click( function() {
    var formData = new FormData($('#uploadForm')[0]);
    $.ajax({
        url: '/upload.php',
        data: formData,
        async: false,
        contentType: false,
        processData: false,
        cache: false,
        type: 'POST',
        success: function(data)
        {

        },
    })
});

PHP:

<?php
    if(empty($_POST)){
        echo true;
    }else{
        echo false;
    }
?>

1 个答案:

答案 0 :(得分:0)

PHP将发布的文件放在_FILE变量中: http://php.net/manual/en/reserved.variables.files.php

因此,即使发布jquery部分工作正常,也无法通过检查PHP中的_POST变量是否为空来查看是否收到了文件。

我不太擅长jQuery,但这应该做你想要的。

$( document ).ready(function() {
    $('#uploadSubmitBtn').on('click', function() {
        var file_data = $('#uploadBrowseBtn').prop('files')[0];   
        var form_data = new FormData();
        form_data.append('file', file_data);                        
        $.ajax({
            url: 'upload.php',
            dataType: 'text',
            cache: false,
            contentType: false,
            processData: false,
            data: form_data,                         
            type: 'post',
            success: function(data){
                $('#uploadForm').html(data);
            }
        });
    });
});

<form id="uploadForm">
<input type="file" id="uploadBrowseBtn">
<input type="button" id="uploadSubmitBtn" value="Upload">
</form>

<?php
    var_dump($_POST);   // empty when received a file
    var_dump($_FILES);  // filled when received a file
?>

这个问题:jQuery AJAX file upload PHP回答了你的问题,并对其实际做法有完美的解释。