可以使用jQuery监听表单提交事件,并在执行表单提交之前关闭模态框。代码示例如下:
jQuery代码:
$(".modal-form").on("submit", function(e){
e.preventDefault(); // 防止浏览器默认行为
var form = $(this);
var modal = form.closest(".modal");
// 在执行表单提交前先手动关闭模态框
modal.modal("hide");
// 执行表单提交
$.ajax({
url: form.attr('action'),
type: form.attr('method'),
data: form.serialize(),
success: function(response) {
// 表单提交成功后再打开模态框
modal.modal("show");
// 在模态框中显示提交结果
modal.find(".modal-body").html(response);
}
});
});
在上面的代码中,我们首先使用jQuery来监听表单的提交事件。当表单被提交时,我们将使用preventDefault()
方法防止浏览器默认行为,然后找到最近的模态框并手动关闭它。
接下来,我们使用jQuery的$.ajax()
方法执行表单提交。在表单提交成功后,我们再重新打开模态框并显示提交结果。
上一篇:表单提交后会重置存储的组件。
下一篇:表单提交后PHP页面不重定向。