Javascript表单提交与包含提交按钮的表单之间的区别

Question

我需要一个理论上的澄清...... Javascript表单提交和包含提交按钮的表单有什么区别？(我正在使用框架Struts,但我认为它不会影响行为)

我的意思是,这是我的例子,提交表单与输入类型="提交"之间的区别是什么:

<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";
}

<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();
}

并在内部提交JAVASCRIPT提交表格？

<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";
}

<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();
}

Answer 1

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

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