Question

我尝试使用ajax提交多个表单，但是如何逐个发送，我的意思是在完成/成功之后发送第一个ajax然后发送第二个ajax，下面是我的脚本：

<form>
 <input type="text" name="name" value="john doe" size="60">
 <input type="text" name="age" value="23" size="2">
</form>

<form>
 <input type="text" name="name" value="Alex" size="60">
 <input type="text" name="age" value="24" size="2">
</form>

<button>Submit</button>


<script>
function post_form_data(data) {
    $.ajax({
        type: 'POST',
        url: 'https://members.lelong.com.my/Auc/Member/Feed/feed.asp',
        data: data,
        success: function () {
            console.log('Success');
        },
        error: function () {
            console.log('error');   
        }
    });
}

$('button').on('click', function () {
    $('form').each(function () {
        post_form_data($(this).serialize());
    });
});
</script>

enter image description here

Answer 1

你可以试试这个：

function post_form_data(data,cache,i) {
    $.ajax({
        type: 'POST',
        url: 'https://members.lelong.com.my/Auc/Member/Feed/feed.asp',
        data: data,
        success: function () {
            console.log('Success');
            i++;
            post_form_data(cache.eq(i).serialize(),_cached,i);
        },
        error: function () {
            console.log('error');   
        }
    });
}

$('button').on('click', function () {

  var _cached=$('form');
  post_form_data(_cached.eq(0).serialize(),_cached,0);

});

Answer 2

您可以添加

async：false

使其顺序。

$.ajax({
    type: 'POST',
    url: 'https://members.lelong.com.my/Auc/Member/Feed/feed.asp',
    data: data,
    async :false ,
    success: function () {
        console.log('Success');
    },
    error: function () {
        console.log('error');   
    }
});

注意： - async：false 可以逻辑上拒绝ajaxified请求的行为。我们不鼓励使用它直到它急需它。

Answer 3

您可以将请求数据放入数组中，从函数返回promise接口并使用done/then or always：

function post_form_data(data) {
    return $.ajax({
        type: 'POST',
        url: '/echo/html',
        data: data,
        success: function () {
            console.log('Success');
        },
        error: function () {
            console.log('error');
        }
    });
}

$('button').on('click', function () {
    var requests = $('form').map(function () {
        return $(this).serialize();
    }).get();
    var i = 0;
    if (requests.length) {
        makeRequest(requests, i);

    }
});

function makeRequest(requests, i) {
    var iPromise = post_form_data(requests[i]);
    if (i < requests.length - 1) {
        iPromise.done(makeRequest(requests, ++i))
    }
}

每个（）逐个提交ajax请求

3 个答案: