js swal怎么让确定按钮在取消右边
可以通过添加自定义CSS样式来实现确定按钮在取消按钮右边的效果。具体步骤如下:
- 在HTML文件中引入SweetAlert的CSS文件和JavaScript文件:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.all.min.js"></script>
- 使用SweetAlert的
fire方法创建弹窗,并在customClass选项中添加自定义CSS样式:
Swal.fire({
title: '确定要执行这个操作吗?',
icon: 'warning',
showCancelButton: true,
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: {
confirmButton: 'swal-confirm-button',
cancelButton: 'swal-cancel-button'
}
});
- 在CSS文件中添加自定义样式,使确定按钮在取消按钮右边:
.swal-confirm-button {
margin-right: 10px;
}
通过以上步骤,你可以让确定按钮在取消按钮右边显示。注意要根据实际情况调整按钮的样式和位置
原文地址: https://www.cveoy.top/t/topic/iONE 著作权归作者所有。请勿转载和采集!