页面不等待来自javascript Sweet Alert的响应

Question

我正在尝试升级我的javascript confirm()操作以使用Sweet Alert(http://t4t5.github.io/sweetalert/).目前我的代码是这样的:

<a href="/delete.php?id=100" onClick="return confirm('Are you sure ?');" >Delete</a>

这等待用户在导航到删除页面之前确认.我想在Sweet Alert中使用这个示例,要求用户在删除之前进行确认:

swal({
 title: "Are you sure?",   
 text: "You will not be able to recover this imaginary file!",   
 type: "warning",   
 showCancelButton: true,   
 confirmButtonColor: "#DD6B55",   
 confirmButtonText: "Yes, delete it!",   
 cancelButtonText: "No, cancel plx!",   
 closeOnConfirm: false,   
 closeOnCancel: false 
}, 
function(isConfirm){   
  if (isConfirm) {     
    swal("Deleted!", "Your imaginary file has been deleted.", "success");
  } 
  else {     
    swal("Cancelled", "Your imaginary file is safe :)", "error");  
  } 
});

我尝试的一切都失败了.显示第一个警报时,页面已经完成并删除了该项目并刷新,然后用户甚至点击了警报按钮.如何让页面等待用户输入？

任何帮助将不胜感激.

Answer 1

您不能将其用作替代品confirm.confirm阻止单个执行线程,直到确认对话框为止,您不能使用基于JavaScript/DOM的对话框产生相同的行为.

您需要/delete.php?id=100在警报框的成功回调中发出请求.

代替...

swal("Deleted!", "Your imaginary file has been deleted.", "success");

你需要

<a href="#">Delete<a>
...

$.post('/delete.php?id=100').then(function () {
  swal("Deleted!", "Your imaginary file has been deleted.", "success");
});

您还必须修复您的delete.php接受POST请求.允许GET请求删除资源是一个很大的问题.Google或任何其他抓取工具第一次找到您的网页时,它会查看href文档中的每个链接,并按照每个链接删除所有内容.它们不会被confirm盒子拦截,因为它们可能(除了谷歌)不会评估任何JavaScript.

Answer 2

你可以这样做.

HTML:

<a href="/delete.php?id=100" class="confirmation" >Delete</a>

JS:

$('.confirmation').click(function (e) {
    var href = $(this).attr('href');

    swal({
        title: "Are you sure?",
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: "#DD6B55",
        confirmButtonText: "Yes, delete it!",
        cancelButtonText: "No, cancel plx!",
        closeOnConfirm: true,
        closeOnCancel: true
    },
            function (isConfirm) {
                if (isConfirm) {
                    window.location.href = href;
                }
            });

    return false;
});

似乎是一个黑客,但它对我有用.