sweetAlert preventDefault 并返回 true

Posted

技术标签:

【中文标题】sweetAlert preventDefault 并返回 true【英文标题】:sweetAlert preventDefault and return true 【发布时间】:2015-08-05 18:37:50 【问题描述】:

我试过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();,事件已经停止,所以默认的东西将不再起作用。 是的,我知道。这就是我在这里寻求解决方案的原因:) 【参考方案1】:

你可以试试这样的

$(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>

你可以说form.submit()而不是window.location = $(this).attr('href');


更新

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

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

这是一个演示http://output.jsbin.com/likoza/2

【讨论】:

对于同一个类有多个链接的人不要忘记 $('.delete').trigger('click', );不是指被点击的元素,而是指所有带有 class="delete" 的元素。 @kikinet 如果有多个元素,那么您可以使用$(e.target).trigger('click', );。用另一个演示更新了我的答案。 对我来说,在function (isConfirm) 上使用触发操作会导致带有删除按钮的循环。我用form.submit(); 改变了动作并且像一个魅力一样工作。谢谢。【参考方案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');
        
    );
);

【讨论】:

【参考方案3】:

我是这样做的:

<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 );
                );
            
        );
    );
);

【讨论】:

以上是关于sweetAlert preventDefault 并返回 true的主要内容,如果未能解决你的问题,请参考以下文章

SweetAlert插件 弹框插件

sweetAlert弹窗

SweetAlert 2 掩码输入

SweetAlert2 使用教程

弹出层小插件之sweetalert

sweetalert2 全面替代 alert ,从 sweetalert2 弹出 text 到 弹出 Dom 以及模态框