ホームページ > ウェブフロントエンド > jsチュートリアル > 外部ボタンが HTML でフォームを送信しないようにするにはどうすればよいですか?

外部ボタンが HTML でフォームを送信しないようにするにはどうすればよいですか?

Barbara Streisand
リリース: 2024-10-26 16:22:02
オリジナル
293 人が閲覧しました

How to Stop an External Button from Submitting a Form in HTML?

HTML ボタンによるフォームの送信を防ぐ方法

Web 開発では、通常、フォームの外にボタンを配置すると JavaScript の実行が許可されます。またはクリック時のその他のカスタムアクション。ただし、場合によっては、これらの外部ボタンが近くに配置されているフォームを意図せず送信してしまうことがあります。ボタンに別の機能を実行させたい場合、これはイライラする可能性があります。

次のシナリオを考えてみましょう:

<code class="html"><form id="myform">
    <label>Label <input /></label>
</form>
<button>My Button</button></code>
ログイン後にコピー

「My Button」要素をクリックすると、次のことが期待されるかもしれません。 JavaScriptをトリガーします。ただし、予期せず myform が送信されます。

この問題を解決するには、ボタンの HTML コードを変更して、フォームが送信されないようにする必要があります。

<code class="html"><button type="button">My Button</button></code>
ログイン後にコピー

値を含む type 属性を追加します。 「ボタン」の部分は、ボタンがフォームの送信を目的としていないことを明示的に指定しているため、送信機能が無効になります。

更新 (2019 年 2 月 5 日):

によるとHTML Living Standard および HTML 5 仕様に従って、type 属性が存在しないか、type 属性に無効な値があると、ボタンはデフォルトで送信ボタン状態になります。

以上が外部ボタンが HTML でフォームを送信しないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート