在 Html 中，为什么单击表单中的常规按钮会导致表单

Question

我有一个带有三个按钮的网页，其中两个按钮用于表单向服务器提交数据，然后将相应的页面发回。 第三个按钮只是在新标签页中打开一个新网页，不需要重新加载当前页面，所以这个按钮只是一个带有一些 onclick() 代码的按钮元素，它不是输入元素的一部分

问题在于，当我点击第三个按钮时，即使它不是输入类型，它也会执行表单操作，为什么它会这样做？

<main>
<form action="/license.process" name="process" id="process" method="post">
    <label>
        Please enter your license information as provided in your license email
    </label>
    <table>
        <tr>
            <td><label title="Email">Email</label></td><td><input type="text" name="licenseEmail" value="paultaylor@jthink.net" class="licenseinputfield"></td>
        </tr>
        <tr>
            <td>
                <label title="License Key 1">
                    License Key 1
                </label>
            </td>
            <td>
                <input type="text" name="licenseKey1" value="50302c02147f23ed809a8f2579338121a2b1594f967bb18" class="licenseinputfield">
            </td>
        </tr>
        <tr>
            <td>
                <label title="License Key 2">
                    License Key 2
                </label>
            </td>
            <td>
                <input type="text" name="licenseKey2" value="0ff02146cd1777d7e0890e659b10218761869212d7b0d60" class="licenseinputfield">
            </td>
        </tr>
    </table>
    <input type="submit" name="cancel" value="Cancel">
    <input type="submit" name="save" value="Save">
    <button onclick="window.open(&#x27;http://www.jthink.net/songkong/buy.jsp&#x27;,&#x27;_blank&#x27;);">
        Get License
    </button>
</form>
</main>

我可以通过将第三个按钮移到表单外来使其正常工作。但是后来我遇到了格式问题，因为按钮显示在下一行，不管我想了解为什么在表单中有按钮会触发表单。

Answer 1

<button> 的默认type 是submit。

如果你希望它是type=button，那么你必须明确地说出来。

Answer 2

你需要添加type="button"属性来防止表单被提交。

我不完全确定为什么，但上周遇到了这个问题。