结合两个函数来检查是否为真,然后继续

combining two functions to check if true then continue

本文关键字:是否 继续 然后 检查 函数 两个 结合      更新时间:2023-09-26

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

我注意到,简单地使用这些函数,即使您单击取消,ajax仍然遵循。我的问题是,confirm trigger是广泛的,是由一个以上的触发器用于不同的事情。那么我该如何检查confirm是否返回false呢?

下面是一个例子:

这是我的代码检查,看看是否确认链接被点击

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

这是做ajax的事情的代码,但也有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,它们都做完全不同的事情,但也有confirm类。

最简单的编辑方法是什么,在这个例子中,trg-delete点击检查confirm点击是否返回truefalse ?

注意:我确实看到了这一点,但它是不同的,因为我使用 on('click')s,他有功能。

为什么要构建两个独立的事件?

为什么不只在.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);
    });
  }
});

从第一个点击处理程序返回一个"confirmed"布尔值不会对第二个点击处理程序产生任何影响。这两个动作将保持独立。

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

幸运的是,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.
});