无法在自定义 HTML 按钮单击时关闭甜蜜警报 2 模式



我很难调试这个。我正在使用来自SweetAlert2的自定义HTML参数。我想要实现的是,每当我单击"返回"按钮时,我都想关闭模态。我确实阅读了文档。我们可以查看 swal.close(( 或 swal.closeModal((。但是当我这样做时,我无法在后退按钮上关闭模态。以下是代码。

//declare custom html
const cancelBtn      = `<button class="cancelSwalBtn" id="standardCancelBtn" >Back</button>`;
const removeAddOnBtn = `<button class="removeAddonSwalBtn" id="standardRemoveAddonBtn">Remove Add-ons</button>`;
const proceed        = `<button type="button" role="button" tabindex="0" class="proceedSwalBtn" id="standardProceedBtn">Proceed</button>`;
const html           = `<p>Your voucher does not cover the cost additional of addons. </p><div class="btn-holder">${cancelBtn}${removeAddOnBtn}${proceed}</div>`;
//custom swal
swal({
type: 'info',
title: 'Info',
html: `${html}`,
width :700,
showCancelButton: false,
showConfirmButton:false,
onOpen: (swal) => {
//close btn
$(swal).find('#standardCancelBtn').click(function (e) {
console.log('in');
swal.close();
//swal.closeModal();
})
}
}).then((result) =>{
console.log(result);
});

swal.close()swal.closeModal()应该可以工作。

参考: 甜蜜改变方法

onclick="swal.close(); return false;"

只需添加:onclick="swal.closeModal(); return false;"在你的 html 按钮内,如下所示:

const cancelBtn = `<button class="cancelSwalBtn" id="standardCancelBtn" onclick="swal.closeModal(); return false;">Back</button>`;

最新更新