jQuery File Upload - 在表单提交时上传文件

Question

我有一个带有 Jquery 文件上传的表单。形式为：

<form action="" method="post" name="job_offer_reply" id="job_offer_reply" enctype="multipart/form-data">
    <textarea name="description" id="description" class="form-control" rows="3"></textarea>
    <div id="drop">
        <?php _e('Drop You CV Here', 'ja'); ?>
        <a><?php _e('OR Browse', 'ja'); ?></a>
        <input type="file" name="upl" multiple/>
    </div>    
    <input id="submit" type="submit" class="btn btn-primary" name="submit" value="Submit">
</form>

文件上传初始化函数（简称）是：

$(function(){
    $('#drop a').click(function(){
        // Simulate a click on the file input button
        // to show the file browser dialog
        $(this).parent().find('input').click();
    });


    // Initialize the jQuery File Upload plugin
    $('#job_offer_reply').fileupload({

        formData: {
            action: 'ja_upload_cv',
        },
        dropZone: $('#drop'),
        add: function (e, data) {

            // Automatically upload the file once it is added to the queue
            var jqXHR = data.submit();
        },

        done:function(e, data){
            console.log(data);
        },
        fail:function(e, data){
            // Something has gone wrong!
            data.context.addClass('error');
        }

    });
});

此代码会在文件被选中/删除后立即上传。当我删除

var jqXHR = data.submit();

它根本没有提交，即使在表单提交之后也是如此。

单击提交按钮时如何上传文件（将其保存在我的 $_FILES 数组中）？

Answer 1

只需修改您的 add 回调以使用事件侦听器：

 add: function (e, data) {
    $('#submit').click(function(){
        var jqXHR = data.submit();
    };
 },