如何在AJAX表單提交請求期間顯示實時腳本輸出？

Question

如何使用jQuery在腳本上顯示“實時反饋”？

我有一個button ，用於提交要處理的表單。 處理需要很長時間。 我希望有一個<div id="progress"></div> ，在其中顯示有關訂單處理腳本正在執行的實時進度報告。 如果一切順利，我想重定向到“查看順序”腳本，否則，只顯示進度報告（不重定向到查看順序）

怎么樣？ 目前我有這個：

$("#placeorderbutton").click(function(e) {
    e.preventDefault();
    this.innerHTML = 'Placing Order...';
    this.disabled = true; 
    $.ajax({
        type: 'post',
        url: 'process_order.php',
        data: $('form#order').serialize(),
        success: function(data) {
            $("#main").load('view_order.php');            
        }
    });
}); 

即使我的process_order文件中有打印語句，它們也不會在屏幕上的任何位置顯示。 好吧，當然不是...我不知道如何構建我的jQuery / AJAX以使其顯示。

我不確定如何進行。

Answer 1

您將需要開始漫長的過程，然后啟動計時器以輪詢狀態。 請記住，這變得比價格昂貴更昂貴。

$("#placeorderbutton").click(function(e) {
    e.preventDefault();
    this.innerHTML = 'Placing Order...';
    this.disabled = true; 
    $.ajax({
        type: 'post',
        url: 'process_order.php',
        data: $('form#order').serialize(),
        success: function(data) {
            $("#main").load('view_order.php');            
        }
    });
    setTimer($.ajax({
        type: 'post',
        url: 'view_order.php',
        data: $('form#order').serialize(),
        success: function(data) {
            $("#main").append(data);            
        }
    }), 30000);  //check every 30 Seconds
});