Question

这是我的表格

<form name="uploadImg" id="uploadImg" class="profile-image" enctype="multipart/form-data">
        <input type="file" name="profile" id="updProfileImg">
</form>

这是我的jquery事件

$("#updProfileImg:file").change(function() {
    $('#uploadImg').submit(function() {
    var queryString = new FormData($('form')[0]);
    $.ajax({
        type: "POST",
        url: 'index.php?route=account/edit/upload',
        data: queryString,
        contentType: false,
        processData: false,
        beforeSend: function() {
        },
        success: function() {
        }
    })
})
})

但是更改事件没有触发表单提交，所以我尝试trigger('submit')，但页面刷新而不是在ajax中提交。

Answer 1

您正确绑定事件。正如您目前所拥有的那样，更改字段将触发提交的绑定。它必须是这样的：

// bind the submit event
$('#uploadImg').submit(function() {
    var queryString = new FormData($('form')[0]);
    $.ajax({
        type: "POST",
        url: 'index.php?route=account/edit/upload',
        data: queryString,
        contentType: false,
        processData: false,
        beforeSend: function() {
        },
        success: function() {
        }
    });
});

// bind the change event to trigger a submit
$("#updProfileImg:file").change(function() {
    $("#uploadImg").submit();
});

Answer 2

一个简单的修改

$("#updProfileImg:file").change(function() {
        //$('#uploadImg').submit(function() {
            var queryString = new FormData($('#uploadImg')[0]);
            $.ajax({
                type: "POST",
                url: 'index.php?route=account/edit/upload',
                data: queryString,
                contentType: false,
                processData: false,
                beforeSend: function() {

                },
                success: function() {

                }
            })
        //})
    })

Answer 3

你应该试试这段代码：

$("#updProfileImg:file").on("change", function(){
    var queryString = new FormData($('#uploadImg')[0]);
    $.ajax({
        type: "POST",
        url: 'index.php?route=account/edit/upload',
        data: queryString,
        contentType: false,
        processData: false,
        beforeSend: function() {},
        success: function() {}
    })
});

因为我希望第一次更改时会激活“.change（）”一次。

jquery更改事件以使用ajax提交表单

3 个答案: