Question

我使用javascript制作此警报。这是一个简单的警报，显示一个方框：确定删除ID no = ..并显示一个按钮确定或取消

现在我想将此警报转换为甜蜜警报。我怎么能这样做。谢谢。

代码：

$(document).ready(function(){
$(".delete-link").click(function()
{
    var id = $(this).attr("id");
    var del_id = id;
    var parent = $(this).parent("td").parent("tr");
    if(confirm('Sure to Delete ID no = ' +del_id))
    {
        $.post('delete.php', {'del_id':del_id}, function(data)
        {
            parent.fadeOut('slow');
        }); 
    }
    return false;
});
});

Answer 1

         swal({
        title: "Are you sure?",
        text: "Text here.",
        icon: "warning",
        buttons: [
            "No, don't do that!",
            'Yes, do that'
        ],
        dangerMode: true,
    }).then(function (isConfirm) {
        if (isConfirm) {

        swal({
            title: 'Done',
            text: 'Your task has been done!',
            icon: 'success'
        })

        } else {
            swal("Not done", "your task has not been done", "error");
        }

Answer 2

尝试以下操作：

$(document).ready(function(){
$(".delete-link").click(function(e))
{
    e.preventDefault();
    var id = $(this).attr("id");
    var del_id = id;
    var parent = $(this).parent("td").parent("tr");
    swal({
      title: "Are you sure?",
      text: "Sure to Delete ID no = " + del_id,
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "Yes, delete it!",
      closeOnConfirm: false
    },
    function(){
      $.post('delete.php', {'del_id':del_id}, function(data)
        {
            parent.fadeOut('slow');
        }); 
    });
});
});

参考：http://t4t5.github.io/sweetalert/

自定义警报Sweet Alert

2 个答案: