在弹出窗口外单击时,请防止SweetAlert关闭



我正在使用甜蜜的警报在带有两个按钮的电子商务应用程序中在我的产品视图上进行弹出式弹出窗口:一个用于推车视图,另一个用于重新加载视图。

但是,当用户单击弹出窗口外时,弹出窗口会自动关闭。我已经尝试了以下属性以阻止其关闭,但没有任何作用:

hideOnOverlayClick: false,
hideOnContentClick: false,
closeClick: false,
helpers: {
    overlay: { closeClick: false } 
}

任何帮助/建议都将受到高度赞赏。

谢谢。

如果您使用的是Sweet Alert 2,则可以使用此配置

allowOutsideClick: false

这应该有效。

关于甜味警报2(更有效的解决方案)

实际上,这里的所有答案都没有涵盖其他解雇弹出窗口的方式。那是使用键盘。特别是 esc 键。为了防止您要添加两个选项,而不是一个。

allowOutsideClick: false,
allowEscapeKey: false,

快速示例:

Swal.fire({
  title: 'Do not dismiss!',
  icon: 'warning',
  showConfirmButton: false,
  allowOutsideClick: false,
  allowEscapeKey: false
})
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>

您要寻找的属性是CloseonClickoutside:

closeOnClickOutside: false

sweetalert 2:

allowOutsideClick: false

版本3 以下一些版本2

closeOnClickOutside: false

backdrop:trueallowOutsideClick: false一起使用,如下所示。它对我有用。

swal({
    backdrop:true,
    allowOutsideClick: false,
    title:'Warning!',
    text:'Do you want to delete records?',
    type:'warning',
    showCancelButton: 0,
    confirmButtonText: 'OK',
}).then(function(e) {
    if (e.value) {
        //do what you want
    }
})

您可以设置此属性:

allowOutsideClick: true

它是允许的indeclick:false,例如

swal({
  title: "View Cart",
  text: "Are you sure?",
  type: "warning",
  showCancelButton    : true,
  confirmButtonColor  : "#ff0000",
  confirmButtonText   : "Yes",
  allowOutsideClick: false,
  CancelButtonText    : "No"
            },
                function() //confirm
            {
                //if Yes do this
            }
);

如果以上答案对您不起作用,请尝试:

closeOnClickOutside: false

我们使用的版本比2 更高,在我们的情况下,我们需要。

chrome:

closeOnClickOutside: false

for Firefox:

allowOutsideClick: false 

我有相同的问题,这就是我解决的方法:setCanceLedOntouchoutside(false)

var dialog = SweetAlertDialog(context, SweetAlertDialog.ERROR_TYPE);
dialog.setTitleText(getString(R.string.session_expired));
dialog.setConfirmClickListener { sDialog ->
    sDialog.dismissWithAnimation()
    Utils.signOut(context!!)
    Handler().postDelayed({
    startActivity(getLoginIntent(context!!))
    AcTrans.Builder(context!!).performFade()
    }, 500)};
dialog.setCanceledOnTouchOutside(false);
dialog.show();

sweetalert版本&lt;2

swal(
         "Records will be deleted permanently.",  //title
         "Do you want to delete records?",  //text
         "warning",  //icon
         {
              closeOnClickOutside: false, // prevent close on click anywhere/outside
              buttons: ["No", "Yes"], //with custom label
              dangerMode: true,
         }
    ).then(ok => {
         if (ok) {
              console.log("deleted")
         }
         else {
              console.log("not deleted")
         }
    })

对于最新版本,它是

allowOutsideClick: false

如果您不想在ESC上关闭对话框或下面的外部对我有用。!

swal({
  title: "Are you sure?",
  text: "You will not be able to recover this details!",
  icon: "warning",
  closeOnClickOutside: false,
  closeOnEsc: false,
  allowOutsideClick: false,
  buttons: [
    'No, cancel it!',
    'Yes, I am sure!'
  ],
  dangerMode: true,
})

最新更新