js swal阻止表单提交弹出确认框确认之后再提交
你可以使用JavaScript的事件监听器来实现这一功能。首先，你需要阻止表单的默认提交行为，然后在确认框确认之后再手动提交表单。
下面是一个示例代码：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://unpkg.com/sweetalert/dist/sweetalert.css">
</head>
<body>
<form id="myForm" action="submit.php" method="post">
<input type="text" name="name" placeholder="Name">
<button type="submit">Submit</button>
</form>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script>
// 监听表单的提交事件
document.getElementById("myForm").addEventListener("submit", function(event) {
// 阻止表单的默认提交行为
event.preventDefault();
// 弹出确认框
swal({
title: "确认提交?",
text: "确认之后将提交表单",
icon: "warning",
buttons: true,
dangerMode: true,
})
.then((willSubmit) => {
if (willSubmit) {
// 确认之后手动提交表单
document.getElementById("myForm").submit();
}
});
});
</script>
</body>
</html>
在上面的示例中，我们使用了addEventListener来监听表单的提交事件。当提交事件被触发时，我们调用event.preventDefault()来阻止表单的默认提交行为。然后，我们使用swal函数弹出确认框，当用户点击确认按钮之后，我们手动调用submit方法提交表单
原文地址: https://www.cveoy.top/t/topic/iONz 著作权归作者所有。请勿转载和采集!