sweetAlert阻止默认事件和返回true

3

我尝试了sweeAlert插件,它运行得很完美,但我不知道如何在确认后执行默认操作。

$(document).ready(function () {
function handleDelete(e){
    e.preventDefault();
    swal({
        title: "Are you sure?",
        text: "You will not be able to recover the delaer again!",
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: "#DD6B55",
        confirmButtonText: "Yes, delete!",
        closeOnConfirm: false
    },
    function (isConfirm) {
        if (isConfirm) {
            return true;
        }
    });
};
});

和按钮

 <a href="{plink delete! $row->id_dealers}" class="delete" onclick"handleDelete(event);">&nbsp;</a>
 //{plink delete! $row->id_dealers} Nette -> calls php delete handler

我也尝试过使用unbind()off()代替return false,但不起作用。 以前我在onclick属性中使用confirm()return truereturn false,虽然有效,但看起来很糟糕。


事件已经被停止,因为 e.preventDefault();,所以默认的东西将不再起作用。 - Dhiraj
是的,我知道。这就是为什么我在这里寻求解决方案的原因 :) - kristyna
4个回答

5
你可以尝试类似这样的东西。
$(document).ready(function () {
  $('.delete').on('click',function(e, data){
    if(!data){
      handleDelete(e, 1);
    }else{
      window.location = $(this).attr('href');
    }
  });
});
function handleDelete(e, stop){
  if(stop){
    e.preventDefault();
    swal({
      title: "Are you sure?",
      text: "You will not be able to recover the delaer again!",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "Yes, delete!",
      closeOnConfirm: false
    },
    function (isConfirm) {
      if (isConfirm) {
        $('.delete').trigger('click', {});
      }
    });
  }
};

这里有一个演示http://jsbin.com/likoza/1/edit?html,js,output

另一种方法是使用表单而不是 href

标记将如下所示

<form action="">
  <input type="submit" ...... />
</form>

而不是使用window.location = $(this).attr('href');,你可以直接使用form.submit()


更新

如果页面上有多个元素,则可以像这样使用trigger

$(e.target).trigger('click', {});

Here is a demo http://output.jsbin.com/likoza/2


对于那些有多个具有相同类的链接的人,请不要忘记$('.delete').trigger('click',{}); 不是指单击的元素,而是所有类为“delete”的元素。 - kristyna
如果有多个元素,那么可以使用 $(e.target).trigger('click', {});。我已经更新了我的答案并提供了另一个示例。 - Dhiraj
对我来说,在 function (isConfirm) 上使用触发器动作会导致删除按钮出现循环。我改用了 form.submit(); 的动作,效果非常好。谢谢。 - Pablo

2
这是我实现的方法:
$('.delete').on('click', function(e) {
    e.preventDefault();
    var currentElement = $(this);

    swal({
            title: "Are you sure?",
            text: "You will not be able to recover the delaer again!",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "Yes, delete!",
            closeOnConfirm: false
        },
        function () {
            window.location.href = currentElement.attr('href');
        }
    );
});

0
如果你想保留事件的发生,你可以使用带有参数的触发器事件。这意味着你可以在表单、链接或基本上任何事件上使用它。
$(document).ready(function () {
  $('.link').click(function (ev, param) {
    if (param == 'approved') { // User approved
      return true; // Not preventing default because user approved
    }

    // stopping event, before might triggering the event again, depends on user confirming 
    ev.preventDefault();
    ev.stopPropagation();

    swal({
      title: "Are you sure?",
      text: "You will not be able to recover the delaer again!",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "Yes, delete!",
      closeOnConfirm: false
    }).then((result) => {
      if (result.isConfirmed) {
        // Triggering the event again, but with approve flag
        $(this).trigger('click', 'approved');
      }
    })
  })
});

0

以下是我的实现方式:

<script>

$(document).ready(function () {
    $("#submitDelete").on("click", function () {
        swal({
            title: "Delete important stuff?",
            text: "That seem like your deleting some important Item. Are you sure?",
            dangerMode: true,
            icon: "warning",
            buttons: true,
            dangerMode: true
        }).then((confirmed) => {
            if (confirmed) {
                $(function () {
                    $('#DeleteForm').submit(); // manully submit });
                });
            }
        });
    });
});


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接