jQuery阻止表单默认提交行为后,要继续进行提交行为,怎么做?
具体是这样的:
一个删除按钮,在提交之前用sweetalert2提示一下,当按下提示框中的“确认”按钮后,继续提交表单。
html代码:
<form action="/articles/{{ $article->id }}" method="POST">
{{ method_field('DELETE') }}
{{ csrf_field() }}
<input class="btn btn-danger btn-sm need-alert" type="submit" value="删除">
</form>
js代码:
<script>
$('.need-alert').on('click', function (event) {
//阻止默认提交事件
event.preventDefault();
//sweetalert2的提示框代码:
swal({
title: '确定要删除吗?',
text: '删除后不能恢复!',
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: '确认删除'
}).then(function () {
}).catch(swal.noop);
})
</script>
preventDefault()阻止默认提交事件后,sweetalert2提示框可以正常弹出。
问题:
当点击sweetalert2提示框的“确认删除”后,要继续提交这个表单,要怎么写?
巴扎黑2017-05-16 16:48:27
给按钮绑定点击事件,在事件的回调函数中实现弹窗,并判断用户选择的弹窗值,为真则获取表单元素触发提交事件$("form").submit()
不为真则做其他相应处理
伊谢尔伦2017-05-16 16:48:27
讲道理,input的type写成submit让你需要额外写阻止默认事件,type改成button,就不用阻止默认事件了。你的确认框应该是有回调函数的,或许就是then里面,直接写提交应该可以的