没有类型提交的按钮提交表单

Question

我有这个：

<form action="/newPost" method="POST" style="max-width:450px; margin:50px auto;">
        <a href="/media">See Current Posts</a>
          <input name="postTitle" type="text" class="f-input" placeholder="Subject">
          <input name="socialLink" type="text" class="f-input" placeholder="Social Link">
          <textarea name="postDescription" class="f-input" placeholder="Type a message"></textarea>
          <input type="text" name="url" id="url" required readonly>
          <button id="upload_widget" class="button">Upload Photo</button>
          <br>
          <br>
          <button type="submit" value="Send">Send</button>
      </form>

然而，当我点击这个<button id="upload_widget" class="button">Upload Photo</button>按钮时，它实际上提交了表单，但是，我没有定义type=submit！！！它不应该提交表单，除非它作为类型提交。我错了吗？我该如何解决这个问题？

Answer 1

参见the specification：

The missing value default and invalid value default are the Submit Button state.

<button> 元素的默认 type 是 submit。

如果你想让它只触发 JavaScript 那么你必须 明确地 将它设置为 type="button".

没有类型提交的按钮提交表单

button submitting form without type submit

html

javascript

ejs