如何更改 Sweet Alert 2 中聚焦/按下按钮的颜色？

【问题标题】：How to change the color of a focused/pressed button in Sweet Alert 2?如何更改 Sweet Alert 2 中聚焦/按下按钮的颜色？
【发布时间】：2019-04-13 06:39:51
【问题描述】：

对于 Sweet Alert 2 弹出确认窗口，如果我将属性“allowEnterKey”设置为默认值 true，则在弹出窗口时确认按钮会自动聚焦。此外，此按钮的颜色将与其常规颜色不同（例如，未聚焦或按下时的颜色）

另一方面，如果我将“allowEnterKey”设置为 false，则此按钮不会突出显示，颜色将是其常规颜色。但是用户将无法通过按 Enter 键来关闭窗口，这对我来说并不理想。

那么，当按钮获得焦点时，如何将按钮的颜色更改为常规颜色？

A sample pop-up confirmation window, where the button is highlighted and grey instead of its regular color blue

【问题讨论】：

标签： javascript sweetalert sweetalert2

【解决方案1】：

documentation 指定颜色选项：confirmButtonColor 和 cancelButtonColor。

swal({
  title: 'Are you sure?',
  text: "You won't be able to revert this!",
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, delete it!'
}).then((result) => {
  if (result.value) {
    swal(
      'Deleted!',
      'Your file has been deleted.',
      'success'
    )
  }
})

如果这还不够，您还可以应用自定义 CSS 类，例如：

confirmButtonClass: 'btn btn-success',
cancelButtonClass: 'btn btn-danger',

【讨论】：

感谢您的回答，但我需要更改确认按钮被聚焦或按下时的颜色，而不是确认按钮的常规颜色。有没有办法做到这一点？
是的，使用 CSS。见stackoverflow.com/questions/3898781/…
我明白了。谢谢！