10

当用户在我的网站上发表评论时，我正在使用sweetalert2脚本，它向下滚动到他们的评论并弹出甜蜜警报，但是当他们在甜蜜警报框上单击确定时，它会滚动回顶部。

从我一直在阅读的内容来看，我需要某种 preventdefault 或其他东西，但我不知道那会去哪里？

这是我的脚本：

<!-- Sweet alert -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/6.6.8/sweetalert2.min.js"></script>
<script>
window.location.hash = "comment-<?php echo $newcommentid; ?>";
 $(document).ready(function () {
    swal({
                title: "Comment Posted",
                text: "Thanks, your comment has now been successfully posted.",
                type: "success"
            });
 });     

</script>
4

8 回答 8

8

我通过简单地在fire(): heightAuto: false

Swal.fire({
  heightAuto: false,
  text: "I\'m sure this would run on SWAL2@7*"
)};
于 2020-04-28T11:29:13.807 回答
3

尝试这个

$('#comment').click(function(event){
   //....swal stuff
   event.preventDefault();
});
于 2017-09-09T21:52:43.660 回答
3

基于版本 7.* 你可以使用这种风格：

html.swal2-shown,body.swal2-shown { overflow-y: hidden !important; height: auto!important;}
于 2018-10-03T04:24:18.090 回答
1

对于那些仍然有同样问题的人，您可以在您的 Sweet Alert 选项中添加：“ heightAuto: false ”，问题就解决了。

Swal.fire({
heightAuto: false,
title: 'Hello',
Text: 'This is an alert'
});
于 2020-02-24T21:18:51.423 回答
1

对于那些在身体上添加了隐藏溢出的人来说，这是一个常见的问题。

来源：https ://github.com/sweetalert2/sweetalert2/issues/781

解决方案很简单...将其添加到您的 CSS 中：

body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown) { overflow-y: visible !important; }

于 2018-01-14T17:19:21.207 回答
1

使用该backdrop选项并将其设置false为如下。

swal({
   backdrop:false,
   title: "Comment Posted",
   text: "Thanks, your comment has now been successfully posted.",
   type: "success"
});
于 2019-08-01T05:16:59.163 回答
0

有时您可能需要更多。我试图使用以前的答案，但它在 Electron 上对我不起作用。我通过使用 heightAuto 和背景来解决这个问题。使用 rgba 值似乎可以很好地模拟默认背景。手动设置背景是唯一为我解决问题的方法。

swal({
   title: "Title here",
   text: "Text here",
   icon: "success",
   heightAuto: false,
   backdrop: "rgba(0,0,0,0.4)"
});
于 2021-04-19T21:47:28.037 回答
-1

我通过使用让它工作，我在移动设备上遇到了问题，它把身体固定在位置上，它使 html 的高度为 0。

body.swal2-shown, body.swal2-shown.swal2-iosfix {
position: initial !important;

}

于 2021-10-22T09:09:06.083 回答