SweetAlert2 - 如果只有一个按钮，它会在模态打开后立即突出显示

Question

我刚刚使用SweetAlert改为SweetAlert 2.我需要一段时间才能到达，但除了一件事我完成了我想要的东西。

一旦打开模态，如果有1个按钮且没有输入等，按钮会突出显示如下：

在进行任何互动按钮之前，有没有办法阻止它突出显示按钮？

更新：

Answer 1

只需将此代码添加到您的css

中

button.swal2-styled {
    outline: none;
}

Answer 2

请在打开Sweetalert之前找到下面的片段，其中有一个函数可以调用，在那里你可以做一些你需要的东西，比如停止突出显示按钮或其他东西。

有关更多信息以及更多活动（如OnClose等），请找到此Link并找到 CONFIGURATION 部分

我希望它会帮助你。

＆＃13;

＆＃13;

swal({
  title: 'Alert!',
  text: 'Heyyyyyyyyyyyyyy',
  onOpen:OnOpenFunction(),
  confirmButtonClass:"btn-disable",
  buttonsStyling:true
})

function OnOpenFunction()
{
     //Stop Highlighting your button etc..
	 //alert("On Before Open Model Event!!!!!");
}

＆＃13;

.btn-disable
        {
        cursor: not-allowed;
        pointer-events: none;
        outline: none;
        /*Button disabled - CSS color class*/
        color: #c0c0c0;
        background-color: #ffffff;

        }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/sweetalert2/6.3.2/sweetalert2.min.js"></script>
<link href="https://cdn.jsdelivr.net/sweetalert2/6.3.2/sweetalert2.min.css" rel="stylesheet"/>

＆＃13;

＆＃13;

＆＃13;

Answer 3

@Badal提到的解决方案正在运行，但它依赖于内部插件类，这很糟糕。

更好的解决方案是使用confirmButtonClass选项：

.no-outline {
  outline: none;
}

然后将该类传递给confirmButtonClass选项：

swal({
  ...
  confirmButtonClass: 'no-outline',
  ...
})