SweetAlert - 更改颜色的按钮

我试图改变取消按钮的颜色，就像我可以确认按钮，但它似乎不工作的原因。SweetAlert - 更改颜色的按钮

代码是：

swal({ title: "Are you sure?", text: "You will not be able to recover this imaginary file!", type: "warning", showCancelButton: true, cancelButtonColor: "#DD6B55", confirmButtonColor: "#DD6B55", confirmButtonText: "Yes, delete it!", cancelButtonText: "No, cancel plx!", closeOnConfirm: false, closeOnCancel: false }, function(isConfirm){ if (isConfirm) {  swal("Deleted!", "Your imaginary file has been deleted.", "success"); } else {  swal("Cancelled", "Your imaginary file is safe :)", "error"); } });

来源

2016-10-03 compcobalt

'cancelButtonColor'不是[该API]中的一个选项（http://t4t5.github.io/sweetalert/） – chazsolo

我看不出在这个文档中该选项。也许在那里不支持。你总是可以用CSS创建你自己的类。 –

试试.... https://jsfiddle.net/x20ra1o1/2/ – Hackerman

您使用此版本SweetAlert的：和https://github.com/t4t5/sweetalert源JS文件（https://t4t5.github.io/sweetalert/dist/sweetalert-dev.js），有没有这样的参数改变取消按钮的颜色。

在您使用的文件时，PARAMS是：

var defaultParams = { 
    title: '', 
    text: '', 
    type: null, 
    allowOutsideClick: false, 
    showConfirmButton: true, 
    showCancelButton: false, 
    closeOnConfirm: true, 
    closeOnCancel: true, 
    confirmButtonText: 'OK', 
    confirmButtonColor: '#8CD4F5', 
    cancelButtonText: 'Cancel', 
    imageUrl: null, 
    imageSize: null, 
    timer: null, 
    customClass: '', 
    html: false, 
    animation: true, 
    allowEscapeKey: true, 
    inputType: 'text', 
    inputPlaceholder: '', 
    inputValue: '', 
    showLoaderOnConfirm: false 
};

我建议你使用这个版本SweetAlert的：这里https://github.com/limonte/sweetalert2选择更改取消按钮的颜色是存在的。

您可以修改第一个JS文件的源代码，但是在第二个版本中它可以随时使用。

总是有可用的选项来使用CSS来修改按钮的颜色。但是如果你想用JS定制它，那么SweetAlert2是一个更好的选择。

来源

2016-10-03 17:38:20 gurudeb

这里是从SweetAlert到SweetAlert2的简单移植指南：https：//github.com/limonte/sweetalert2/wiki/Migration-from-SweetAlert-to-SweetAlert2 –

是否可以使用rgba（值）？ –

只是一个迟到的评论，SWAL添加了它不使用的类，例如.confirm和.cancel，这可以在样式表中定义，但是您需要将背景设置为！important，因为SWAL（不确定我是否使用了swal2）将背景颜色直接在元素样式属性中的按钮上。 – Felype

有这样做的没有default方式。但是，您可以覆盖风格的自定义CSS ..

检查此琴：https://jsfiddle.net/74agy8ew/1/

来源

2016-10-03 17:26:56

您可以尝试以下操作。

SweetAlert.swal({ 
         title: 'Thank you', 
         text: 'Thank you for using the quoting tool. Your Quote PDF has been downloaded. The quote has been sent to U.S. Legal for approval.', 
         type: 'warning', 
         confirmButtonText: 'Cancel', 
    confirmButtonColor: "#DD6B55"});

来源

2017-10-18 14:33:25

SweetAlert - 更改颜色的按钮

回答

相关问题