JavaScript表单提交和包含提交按钮的表单之间的区别

Difference between JavaScript form submit and a form containing a submit button

本文关键字：表单 之间 区别 按钮 提交 表单提交 包含 JavaScript      更新时间：2023-09-26

我需要理论上的澄清...JavaScript表单提交和包含提交按钮的表单有什么区别？

（我正在使用框架Struts，但我认为它不会影响行为。

我的意思是，这是我的例子，提交带有input type="submit"的表单有什么区别？

<html:form action="search.do?method=mySearch" method="post" styleId="searchFilterForm">
    <input type="hidden" name="myfield" value="">
    <table border="0" class="filterclass" width="530px">
        <tr>
            <td class="filterheader" align="center">
                <input type="submit" onclick="doMySubmit()" name="MyList" value="SEND" class="button actionbutton" />
            </td>
        </tr>
    </table>
</html:form>
function doMySubmit() {
    var myform = document.getElementById('searchFilterForm');
    myform.myfield.value = "Hello World";
}

并在 JavaScript 中提交表单？

<html:form action="search.do?method=mySearch" method="post" styleId="searchFilterForm">
    <table border="0" class="filterclass" width="530px">
        <tr>
            <td class="filterheader" align="center">
                <input type="button" onclick="doMySubmit()" name="MyList" value="SEND" class="button actionbutton" />
            </td>
        </tr>
    </table>
</html:form>
function doMySubmit() {
    var myform = document.getElementById('searchFilterForm');
    myform.myfield.value = "Hello World";
    myform.submit();
}

最显着的区别是，通过单击提交按钮提交表单时，将有一个与单击的按钮对应的请求参数。因此，在您的示例中，使用提交按钮将有一个名称为 MyList 且值为 SEND 的请求参数。如果你在JavaScript中调用form.submit()，就不会有。

因此，如果您在服务器端调用request.getParameter("MyList");，则使用第一种方法将返回值为 SEND 的字符串，而第二个方法将返回 null .当您想要根据表单是否已提交，甚至使用哪个按钮提交表单（如果您有多个按钮）来控制通过操作的流程时，这一点变得很重要。

如果您的用户禁用 javascript，他将无法提交表单。更好的做法是添加类型提交以实现辅助功能。有关此问题的更多信息

相关文章：