如何使用for循環在javascript中進行表單提交？

Question

我在chrome控制台中編寫了一個javascript，可以從網上下載許多文件。 javascript如下：

for (i=0; i<100; i++) {
$("input[name=id]").val(i);
$("form").submit()
}

我希望我可以下載ID為0到99的所有文件。 但是，我只能下載最后一個文件（即id = 99的文件）。 為什么會這樣？

Answer 1

我認為您錯過了答復。 當您調用第一個表單時，瀏覽器啟動連接，但是緊接着，您要求輸入第二個表單。 惠特取消第一。

您需要使用AJAX調用該表單，以將每個請求及其相應的響應存儲在某個變量中。

您的問題就像您在頁面中單擊太多鏈接然后才加載第一個鏈接時一樣。 最后，加載的鏈接是最后單擊的鏈接。

嘗試此解決方案：

您需要在兩次調用之間留出一些時間來處理響應並開始下載，因此請編寫如下函數：

function submitFormAndWait(i) {
    //this is your code to submit
    $("input[name=id]:hidden").val(i);
    $("form").submit()
    //wait some time and call next form
    if (i < 100) {
        setTimeout(function(){ submitFormAndWait(i + 1); }, 3000);
    }
}

可能的問題：

當您在瀏覽器中提交表單時，這會將響應加載為當前頁面，並且腳本將從零開始。

Answer 2

最好的方法是使用AJAX和FormData。

假設您在網站中使用jQuery，則為此使用一些偽代碼：

var url = '/some/ajax/url';
var i = 0;
for ( ; i < 100; ++i) {
    var formData = new FormData();
    formData.append('some-number-field', i);
    // Send data using Ajax POST
    $.ajax({
        url:  url,
        type: 'POST',
        data: formData,
        success: function(response) {
            // Do something on success
        },
        error: function(xhr, status errorThrown) {
            // Do something on error
        }
    });
}