如何停用表單標籤內按鈕標籤的「提交」行為？

Question

<form action="">
  <button>click</button>
</form>

按鈕在表單內的預設行為是提交該表單。

我如何停用該按鈕的提交行為？

Answer 1

有時你想要保留一個submit 按鈕的細節（例如，在行動裝置上，只有當按鈕是表單的一部分且類型為submit 時，才能通過鍵盤觸發submit 按鈕）。在這種情況下，你需要阻止按鈕的預設行為。

使用jQuery 1.7（使用.on - 我強烈建議閱讀文件- 使用.on 有許多細微差別可以極大地影響效能）

$(document).on("click", "button", "event", function(evt) {
    evt.preventDefault();
    ...
}

使用舊版的 jQuery...

$("#button-id").bind("click", function(evt, ui) {
    evt.preventDefault();
    ...
}

請注意，你可以使用任何選擇器（按類別、元素類型等選擇）或綁定事件的方法（而不是使用.bind，使用適合你的jQuery 版本的.live、.delegate 等）。

Answer 2

在它上面加上 type="button"：

<button type="button">Click</button>

---

可用的型別有：

• "submit"：預設值。提交表單。
• "reset"：重置表單的輸入。
• "button"：無操作。

一個好的參考：https://developer.mozilla.org/en/DOM/HTMLButtonElement