如何在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
});