Question

我有两个触发器，一个从boolean返回confirm，另一个发送ajax request。

我注意到只是简单地使用这些功能，即使你点击取消，ajax仍然会贯彻执行。我的问题是confirm trigger很宽，并且被多个用于不同事物的触发器使用。那么我该如何检查确认是否返回false？

以下是一个例子：

这是我的代码，用于检查是否点击了确认链接

$('div.answers').on('click', '.confirm', function() {
    return confirm('Are you sure?');
});

这是执行 ajaxy things 的代码，但也有confirm类：

$('div.answers').on('click', '.trg-delete', function() {
    var that = $(this);
    var itemid = that.data("id");

    $.ajax({
        type: "POST",
        url: "./delete-answer.php",
        data: { itemID: itemid }
    })
    .done(function(data) {
        if(data == 1) {
            that
            .css("color", "#27AE60")
            .html('<i class="fa fa-fw fa-check"></i>');
        } else {
            that
            .css("color", "#C0392B")
            .html('<i class="fa fa-fw fa-close"></i>');
        };

        window.setTimeout(function() {
            that
            .css("color", "")
            .html('<i class="fa fa-fw fa-close"></i>');
        }, 5000);
    })
    .fail(function(data) {
        that
            .css("color", "#C0392B")
            .html('<i class="fa fa-fw fa-close"></i>');

        window.setTimeout(function() {
            that
            .css("color", "")
            .html('<i class="fa fa-fw fa-close"></i>');
        }, 5000);
    });
});

正如您所看到的，这两个是完全分开的，因为我还有trg-open，trg-closed，trg-choice这样的触发器，它们都完全不同，但也有{{{ 1}} class。

在这个示例中，最简单的方法是点击confirm点击以检查点击时trg-delete是否返回confirm或true？

注意：我确实看到了this，但是因为我在false处使用了函数，所以它有所不同。

Answer 1

为什么要建立两个独立的活动？

为什么不在.trg-delete上（注意第二行）：

$('div.answers').on('click', '.trg-delete', function() {
  if( confirm( "Are you sure?" ) ) { 
    var that = $(this);
    var itemid = that.data("id");

    $.ajax({
      type: "POST",
      url: "./delete-answer.php",
      data: { itemID: itemid }
    })
    .done(function(data) {
      if(data == 1) {
        that
        .css("color", "#27AE60")
        .html('<i class="fa fa-fw fa-check"></i>');
      } else {
        that
        .css("color", "#C0392B")
        .html('<i class="fa fa-fw fa-close"></i>');
      };

      window.setTimeout(function() {
        that
        .css("color", "")
        .html('<i class="fa fa-fw fa-close"></i>');
      }, 5000);
    })
    .fail(function(data) {
      that
      .css("color", "#C0392B")
      .html('<i class="fa fa-fw fa-close"></i>');

      window.setTimeout(function() {
        that
        .css("color", "")
        .html('<i class="fa fa-fw fa-close"></i>');
      }, 5000);
    });
  }
});

Answer 2

简单地返回＆＃34;确认＆＃34;第一次单击处理程序中的布尔值对第二次单击处理程序没有任何影响。这两项行动将保持独立。

但是，您可以通过抑制第二次单击操作并从第一次开始有条件地触发它来实现所需的操作。

幸运的是，jQuery允许自定义事件，这在这种情况下非常有用。

$('div.answers').on('click', '.confirm', function() {
    if( confirm('Are you sure?') ) {
        $(this).trigger('confirmed');
    }
});

// Now specify a custom `confirmed` handler
$('div.answers').on('confirmed', '.trg-delete', function() {
    var that = $(this);
    var itemid = that.data("id");

    $.ajax({
        type: "POST",
        url: "./delete-answer.php",
        data: { itemID: itemid }
    })
    // etc.
});

<强> DEMO

合并两个函数来检查是否为true然后继续

2 个答案: