javascript - 停止 Javascript 计时器

Question

我正在尝试使用 PHP/wkhtmltopdf 在网络服务器上动态创建 PDF，这涉及将 PDF 生成过程发送到后台以防止页面超时。

为了检查作业是否已成功完成，我使用了 Javascript(我很讨厌)，更具体地说是 jQuery/AJAX 来连续查询服务器以查看 wkhtmltopdf 的进程是否已结束。如果它仍在运行，则 PHP 脚本不返回任何内容并直接退出。如果该过程成功结束，则会生成 PDF 的 html 链接，然后将其转储到 <div></div> 中。 .

所有服务器端代码都可以完美运行，但我被困在 Javascript 组件上。下面的代码有点工作，但不是计时器在生成 PDF 后停止，而是继续查询服务器。我如何让它停止？

$('#pdfmodal').on('shown', function () {
    pdf(); // fire PDF generation process function
    (function worker() {
        $.ajax({
            url: 'pdfpidcheck.php', 
            success: function(data) {
                if(data == ''){
                    // Schedule the next request if nothing returned (i.e. still running)
                    setTimeout(worker, 5000);         
                 } else {
                    // dump link to pdf
                    $('.pdfmodal').html(data);
                 }
             }
         });
    })();
})

Answer 1

要停止计时器，您只需记住 setTimeout() 的返回值并对其调用 clearTimeout()。

var id = setTimeout(fn, 5000);

// then some time later
clearTimeout(id);

在您向我们展示的代码中，这应该不是问题，除非您从其他地方调用 worker()，或者除非 .on( ) 处理程序在创建 PDF 时被第二次调用。您当前的代码看起来不知道如何处理同时创建的两个 PDF，或者甚至在第一个仍在处理时触发第二个 PDF。

您可以防止多个计时器像这样运行:

$('#pdfmodal').on('shown', function () {
    var modal = $(this);
    pdf(); // fire PDF generation process function
    (function worker() {
        $.ajax({
            url: 'pdfpidcheck.php', 
            success: function(data) {
                var timer = modal.data(timer);
                if(data == ''){
                    // make sure we never have more than one timer running
                    if (timer) clearTimeout(timer);

                    // Schedule the next request if nothing returned 
                    //    (i.e. server process still running)
                    timer = setTimeout(worker, 5000);         

                    // save timer for later use
                    modal.data("timer", timer);
                 } else {
                    // clean up timer data
                    if (timer) clearTimeout(timer);
                    modal.removeData("timer");
                    // dump link to pdf
                    $('.pdfmodal').html(data);
                 }
             }
         });
    })();
})