Question

有人知道如何在关闭时将动画应用于甜蜜警报2吗？似乎function(dismiss)似乎无法解决问题。

$.ajax({
  method:'POST',
  url:'sql/record.php',
  data:formData,
  contentType: false,
  processData: false,
  success: function(response){
    swal({
      title: 'Success!',
      text: "New record has successfully added.",
      type: 'success',
      animation: false,
      customClass: 'animated tada',
      showCancelButton: false,
      confirmButtonText: 'OK'
    }).then(function(result){
    }, function(dismiss){
      swal({customClass: 'animated bounceOut'});
    }
  });
);

Answer 1

您应该添加名为onClose的属性。试试这个：

$.ajax({
  method:'POST',
  url:'sql/record.php',
  data:formData,
  contentType: false,
  processData: false,
  success: function(response){
    swal({
      title: 'Success!',
      text: "New record has successfully added.",
      type: 'success',
      animation: false,
      customClass: 'animated tada',
      showCancelButton: false,
      confirmButtonText: 'OK',
      onClose: function(modal) {
         modal.className += ' animated bounceOut';
      }
    })
  });
);

Answer 2

我知道这是个老问题，但是也许有人还在寻找答案（就像我以前一样）。

我设法将动画应用于关闭并确认swal2。此方法无法在swal外部单击以将其关闭。

swal({
    title: 'swal title',
    html: 'some content',
    showLoaderOnConfirm: true,
    animation: false,
    customClass: "animated fadeInLeft",
    onClose: function(){
        return delaySwalWithAnimation("fadeInLeft","fadeOutRight");
    },
    preConfirm: function(){
        return delaySwalWithAnimation("fadeInLeft","fadeOutRight");
    }
}).then(function(result) {
    //...
}

function delaySwalWithAnimation(animationA, animationB){
    return new Promise(function(resolve) {
        $(".swal2-popup").removeClass(animationToRemove);
        $(".swal2-popup").addClass(animationToAdd);
        setTimeout(function() {
            resolve();
        },300);
    });
}

关闭模态时如何在甜蜜警报2中应用动画？

2 个答案: