Javascript 在单击事件上完成

我不是一个javascript开发人员，所以请容忍我的这一点

我需要在jQuery

单击事件完成后执行重定向。这是我所拥有的，但我无法将
.done
应用于
。单击
。用
$包装整个内容。当
不起作用时

$("#printpng").click(function(){
            $('#tool_docprops').click();
            $('#tool_docprops_save').click();
            $('#tool_export').click()
        }).done(function(){
                window.location.href = "<?php echo $base_url ?>/sign/print"
        });

$（“#printpng”）。单击（函数（）{
$（'tool_docprops'）。单击（）；
$（'tool_docprops_save'）。单击（）；
$（“#工具_导出”）。单击（）
}).done（函数（）{
window.location.href=“/sign/print”
});

有谁有更好的解决方案吗

谢谢
试试这样的

$("#printpng").click(function(){
    $('#tool_docprops').click();
    $('#tool_docprops_save').click();
    $('#tool_export').click()
    window.location.href = "<?php echo $base_url ?>/sign/print"
});

据我所知，您需要在单击事件完成后执行页面重定向。
为此，只需在click事件上添加一个回调函数

单击完成后，将触发此回调函数，并在此函数中编写重定向代码

例如：

$("#printpng").click(function(){
   $('#tool_docprops').click(function(e){
      // write here your redirection code
   });
   $('#tool_docprops_save').click(function(e){
     // write here your redirection code
   });
   $('#tool_export').click(function(e){ 
     // write here your redirection code
   });
});

谢谢
假设每次单击都会触发一个超出您控制的Ajax调用（否则为什么会出现此问题），您只需等待任何/所有Ajax请求完成以下操作：

$(document).ajaxStop(function () {
     window.location.href = "<?php echo $base_url ?>/sign/print"
  });

然后在示例中使用它（使用
.Then（）
按顺序运行）：

只需在click handler的末尾编写重定向代码

$("#printpng").click(function(){
    $('#tool_docprops').click();
    $('#tool_docprops_save').click();
    $('#tool_export').click();
    window.location.href = "<?php echo $base_url ?>/sign/print";
});

$（“#printpng”）。单击（函数（）{
$（'tool_docprops'）。单击（）；
$（'tool_docprops_save'）。单击（）；
$（“#工具_导出”）。单击（）；
window.location.href=“/sign/print”；
});

若在更新页面位置之前需要等待异步进程（由单击事件触发）完成，则需要修复解决方案

i、 您的异步过程是一个ajax调用，它在单击#tool_docprops_save后生成一个请求。然后，您应该在该ajax调用上附加一个成功事件，该事件将在ajax调用完成后更新window.location.href。
为了正确起见，这可以使用干净的异步方式完成。这些对象表示将在将来完成的任务，事件处理程序可以附加到该任务的完成。您可以手动调用延期付款的complete

对于大多数具有回调的异步任务，jQuery在后台处理这些对象，您可以实际等待它们完成。

你需要稍微修改一下你的代码

在
#printpng
的click eventhandler中，需要为每个要完成的任务创建延迟对象

假设您手动触发的所有3个单击事件都有等待的内容，因此我们创建了3个延迟

$('#printpng').click(function () {
    var def1 = $.Deferred();
    var def2 = $.Deferred();
    var def3 = $.Deferred();

    .......... other code not yet included
});

现在我们有3个表示任务的对象。如果你拜访他们，就意味着任务已经完成。我们希望在
#tool_export
的click eventhandler完成时完成这些任务

假设这个
#tool_export
有一个click事件处理程序，我们可以通过某种方式将延迟对象传递给它

$('#tool_export').click(function (e, deferred) {
    $.ajax({
        url: 'your_url',
        success: function(result){

            // your code does stuff with the result

            if (deferred !== undefined) {
                deferred.resolve();
            }
        },
        error: function(result){
            if (deferred !== undefined) {
                deferred.reject();
            }
        },
    });
});

如您所见，它进行AJAX调用，如果调用成功，则调用
deferred.resolve（）
，如果出现问题，则调用
deferred.reject（）
。很简单

现在的问题是：如何将这个延迟参数传递给click事件处理程序

你写了：

$('#tool_docprops').click();

这是以下内容的简写：

$('#tool_docprops').trigger('click');

要将
def1
对象作为参数传递，只需编写：

$('#tool_docprops').trigger('click', def1);

因此，事件处理程序被修改为：

$('#printpng').click(function () {
    var def1 = $.Deferred();
    var def2 = $.Deferred();
    var def3 = $.Deferred();

    $('#tool_docprops').trigger('click', def1);
    $('#tool_docprops_save').trigger('click', def2);
    $('#tool_export').trigger('click', def3);

    ..... something is still missing from here
});

您可以传递任意数量的参数

最后要做的事情就是推迟完成这项任务。有一个非常酷的helper方法，名为，它等待任何数量的延迟被解决。因为它也会创建一个延迟的，所以您可以调用它来获得回调。因此，要等待您之前创建的所有3个延迟，您可以编写：

$.when(def1, def2, def3).done(function() { 
    window.location.href = "<?php echo $base_url ?>/sign/print";
});

我举了一个非常简单的例子来说明这一点。没有ajax调用，只有一个超时，但是您可以理解

如果单击“开始”，则需要等待4秒钟才能完成：

我认为您正在寻找jquery承诺，它具有
.done（）
其他单击事件是否会触发ajax请求，您希望在重定向之前等待这些请求完成？为什么不将重定向简单地添加到事件处理程序的末尾？你到底在等什么？其中一个事件确实引发了ajax是的。我正在等待图像从画布流式传输到php脚本。重定向然后加载新创建的图像以进行打印。正在运行经过大量修改的SVG编辑版本；只是事件处理程序，因为您没有任何与之关联的函数，所以我认为您没有正确使用它。如果您需要实际触发一个实际的点击，您需要.trigger（'click'）；我不认为这是OP想要的工作。。。他希望所有三个点击事件都被触发，而不是在每一个事件后都触发一个重拨。在我看来，这似乎是事件处理程序，而不是回调函数。更不用说，这实际上不会导致点击事件，只会捕获事件。请注意，来自SO的评论：“其中一个事件不会触发ajax是。”此解决方案不会等待任何异步进程完成，它会立即重定向。这就是我最初的想法，@TrueBlueAussie正好有这个问题。它在ajax完成之前重定向，这是我需要避免的使用
async:false
是解决ajax问题的一个非常糟糕的方法（假设部分代码在他的控制下）。处理异步事件总是最好的（它们是异步的，这是有充分理由的）：）向它添加额外的超时是很不礼貌的。这仍然是唯一能理解问题的答案。我的意思是在Ajax停止事件中超时（所以两者都是），但“正确”的方法是让事件捕捉到点击触发的每个操作的完成事件，并将它们链接在一起（或者组合承诺并行运行并等待所有3个）。基本上没有足够的信息
$('#tool_docprops').click();

$('#tool_docprops').trigger('click');

$('#tool_docprops').trigger('click', def1);

$('#printpng').click(function () {
    var def1 = $.Deferred();
    var def2 = $.Deferred();
    var def3 = $.Deferred();

    $('#tool_docprops').trigger('click', def1);
    $('#tool_docprops_save').trigger('click', def2);
    $('#tool_export').trigger('click', def3);

    ..... something is still missing from here
});

$.when(def1, def2, def3).done(function() { 
    window.location.href = "<?php echo $base_url ?>/sign/print";
});

$('#printpng').click(function () {
    var def1 = $.Deferred();
    var def2 = $.Deferred();
    var def3 = $.Deferred();

    $('#tool_docprops').trigger('click', def1);
    $('#tool_docprops_save').trigger('click', def2);
    $('#tool_export').trigger('click', def3);

    $.when(def1, def2, def3).done(function() { 
        window.location.href = "<?php echo $base_url ?>/sign/print";
    });
});