Javascript 防止在弹出窗口外单击时关闭 SweetAlert
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/47749095/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Prevent SweetAlert to be closed on clicking outside the popup window
提问by Saqib A. Azhar
I am using Sweet Alertfor a popup on my product view in an E-commerce Application with two buttons: one for going on cart View and another for reloading the view.
我在电子商务应用程序中的产品视图上使用Sweet Alert弹出窗口，其中有两个按钮：一个用于进入购物车视图，另一个用于重新加载视图。
But when a user clicks outside of the popup, the popup window closes automatically. I've tried following properties to stop it to be closed but nothing works :
但是当用户在弹出窗口之外单击时，弹出窗口会自动关闭。我尝试了以下属性来阻止它关闭，但没有任何效果：
hideOnOverlayClick: false,
hideOnContentClick: false,
closeClick: false,
helpers: {
overlay: { closeClick: false }
}
Any help/suggestion is highly appreciated.
任何帮助/建议都受到高度赞赏。
Thanks.
谢谢。
回答by Halawa
If you are using Sweet Alert 2, you can use this configuration
如果您使用的是 Sweet Alert 2，则可以使用此配置
allowOutsideClick: false
This should work.
这应该有效。
回答by Channel
The property you are looking for is closeOnClickOutside:
您正在寻找的属性是 closeOnClickOutside：
closeOnClickOutside: false
回答by SouravOrii
For SweetAlert 2:
对于甜蜜警报 2：
allowOutsideClick: false
and version 3and some below version 2:
和版本 3以及一些低于版本 2 的：
closeOnClickOutside: false
回答by Qammar Feroz
It is allowOutsideClick: false for example
例如 allowOutsideClick: 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
}
);
回答by Gareth32
If the answers above do not work for you try:
如果以上答案对您不起作用，请尝试：
closeOnClickOutside: false
closeOnClickOutside: false
回答by gihandilanka
Use backdrop:truewith the allowOutsideClick: falseas following below. It worked for me.
使用backdrop:true具有allowOutsideClick: 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
}
})
回答by Quacking Kahuna
We are using higher version than 2for Sweat alert and in our case we needed.
我们使用比 2 更高的版本来发出汗水警报，在我们的例子中我们需要。
for Chrome:
铬：
closeOnClickOutside: false
for Firefox:
火狐浏览器：
allowOutsideClick: false
回答by Ph0enixKM
Regarding Sweet Alert 2 (More effective solution)
关于 Sweet Alert 2（更有效的解决方案）
Actually all answers here don't cover another way to dismiss the popup. And that's using keyboard. Especially the ESCkey. In order to prevent that you would want to add two options instead of one.
实际上，这里的所有答案都没有涵盖另一种关闭弹出窗口的方法。那是使用键盘。尤其是ESC键。为了防止这种情况，您需要添加两个选项而不是一个。
allowOutsideClick: false,
allowEscapeKey: false,
Quick example:
快速示例：
Swal.fire({
title: 'Do not dismiss!',
icon: 'warning',
showConfirmButton: false,
allowOutsideClick: false,
allowEscapeKey: false
})<script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>回答by Suresh Maurya
For sweetalert version < 2
对于 Sweetalert 版本 < 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")
}
})
回答by Jitendra
If you wan't want to close dialog on esc or outside click below is working for me.!
如果您不想在 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,
})
