如何覆盖(禁用)表单标记内的按钮标记的"提交"行为？

Question

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

表单内按钮的默认行为是提交该表单.

如何禁用该按钮的提交行为？

Answer 1

添加一个type="button":

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

可用的类型是:

• "提交":默认值.提交表格.
• "reset":重置表单的输入.
• "按钮":什么都不做.

一个很好的参考:https://developer.mozilla.org/en/DOM/HTMLButtonElement

Answer 2

有时您希望保留submit按钮的细节（例如，在移动设备上，submit可以从键盘触发按钮，但前提是该按钮是 form 和 type 的一部分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，使用.live，.delegate根据您的 jquery 版本而定）。

Answer 3

这将通过javascript禁用

<button onclick='return false'>click</button>

但你可以定义类型

<button type='button'>click</button>