1. ホーム
  2. javascript

[解決済み] フォームを送信しないためのHTMLボタン

2022-03-22 18:55:32

質問

あるフォームがあります。そのフォームの外側に、ボタンがあります。このようなシンプルなボタンです。

<button>My Button</button>

それにもかかわらず、クリックするとフォームが送信されます。以下はそのコードです。

<form id="myform">
    <input />
</form>
<button>My Button</button>

このボタンがすべきことは、いくつかのJavaScriptだけです。しかし、上記のコードのように見えても、フォームを送信してしまいます。ボタンというタグをspanに変更すると、完璧に動作します。しかし残念ながら、ボタンである必要があります。そのボタンがフォームを送信するのをブロックする方法はありますか?例えば

<button onclick="document.getElementById('myform').doNotSubmit();">My Button</button>

解決方法は?

これはHTMLの最も厄介な小特徴だと思うのですが...。そのボタンは、投稿しないためには "ボタン" のタイプである必要があります。

<button type="button">My Button</button>

2019年2月5日に更新しました。 の通りです。 HTMLリビングスタンダード (また HTML5仕様 ):

欠損値のデフォルト 無効な値のデフォルト は、Submit ボタンの状態。