如何捕获 form.submit 的响应

javascript dom-events forms form-submit

2022-08-30 02:31:45

我有以下代码：

<script type="text/javascript">
        function SubmitForm()
        {

            form1.submit();
        }

        function ShowResponse()
        {

        }
</script>
.
.
.
<div>
    <a href="#" onclick="SubmitForm();">Click</a>
</div>

我想捕获的 html 响应？我该怎么做？我可以向form1.submit方法注册任何回调函数吗？form1.submit

答案 1

使用普通的javascript，您将无法轻松做到这一点。当您发布表单时，表单输入将发送到服务器并刷新您的页面 - 数据在服务器端处理。也就是说，该函数实际上并不返回任何内容，它只是将表单数据发送到服务器。submit()

如果你真的想在Javascript中获得响应（没有页面刷新），那么你需要使用AJAX，当你开始谈论使用AJAX时，你需要使用一个库。jQuery是迄今为止最受欢迎的，也是我个人最喜欢的。jQuery有一个很棒的插件，叫做Form，它可以完全按照你想要的方式去做。

以下是您如何使用jQuery和该插件：

$('#myForm')
    .ajaxForm({
        url : 'myscript.php', // or whatever
        dataType : 'json',
        success : function (response) {
            alert("The server says: " + response);
        }
    })
;

答案 2

非jQuery vanilla Javascript方式，摘自12me21的评论：

var xhr = new XMLHttpRequest();
xhr.open("POST", "/your/url/name.php"); 
xhr.onload = function(event){ 
    alert("Success, server responded with: " + event.target.response); // raw response
}; 
// or onerror, onabort
var formData = new FormData(document.getElementById("myForm")); 
xhr.send(formData);

对于，默认内容类型是“application/x-www-form-urlencoded”，这与我们在上面的代码段中发送的内容相匹配。如果您想发送“其他东西”或以某种方式调整它，请参阅此处以获取一些细节。POST