javascript - AJAX 多重响应

Question

我现在正在研究 JavaScript 和 AJAX 技术，并且我非常了解 AJAX 和 POST。现在我想知道是否有我的 PHP 代码(在本例中为 Laravel Controller )广播到的广播 channel 之类的东西，然后由客户端的 JavaScript 接收以便操纵某些东西，比如这样的过程:

用户点击一个按钮，按钮内显示一个微调器。按钮旁边有一个状态标签，指示当前正在处理的进程/任务。最后，按钮变成链接或其他东西。所以，我现在想要的是我可以多次更新状态，因为我当前的 AJAX 代码只会在流程结束时收到一条消息或一个状态，仅此而已，中间没有任何内容:

$.ajax({
   url: "/admin/test",
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    },
    method: 'POST',
    dataType: 'json',
    data: {
        id: whatever
    },
    success: function(result)
    {
        console.log(result.status);
    }
});

现在我想知道这进一步如何运作。

Answer 1

你可以利用ajax的beforeSend事件来启动一个进度条，当它完成时你可以将进度条的宽度设置为100%

$.ajax({
    url: "/admin/test",
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    },
    method: 'POST',
    dataType: 'json',
    data: {
        id: whatever
    },
    beforeSend : {
        // start progress bar
    },
    success: function(result)
    {
        console.log(result.status);
        // complete progress bar
    }
 });

此外，您可以使用 css 应用过渡，以在进度条中提供进度的感觉。