JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

【HTML5】formnovalidate属性でフォームの入力検証(バリデーション)を無効化する方法

HTML5では、formnovalidate属性を使用することで、フォーム送信時の入力検証(バリデーション)を回避できます。

formnovalidate属性とは

formnovalidate属性は、HTML5で導入された送信ボタン(type="submit")専用の属性です。この属性が付いたボタンがクリックされると、そのフォームに設定されている入力チェック(required属性やtype="email"などの形式検証)をすべてスキップして送信されます。

たとえば、「入力途中でも一時保存したい」「あえて空欄のまま送信したい」といったケースで便利です。フォーム全体ではなく、ボタン単位で検証の有無を切り替えられるのが大きな特徴です。

サンプルコード

以下の例では、2つ目の送信ボタンに対して検証を無効にしています。

<!DOCTYPE html>
<html>
  <head>
    <title>HTML formnovalidate attribute</title>
  </head>
  <body>
    <form action = "new.php" method = "get">
      Rank <input type = "number" name = "rank"><br>
      <input type = "submit" value = "Submit"><br>
      <input type = "submit" formnovalidate = "formnovalidate" value = "Submit with no validation">
    </form>
  </body>
</html>

コードの解説

このサンプルには、2つの送信ボタンが配置されています。

  • 1つ目のボタン(Submit):通常どおり入力検証を実行します。数値以外の不正な値が入力されている場合は送信されません。
  • 2つ目のボタン(Submit with no validation):formnovalidate属性が設定されているため、入力内容に関係なく検証をスキップして送信されます。

このように、同じフォーム内に「検証あり」と「検証なし」のボタンを併置できるため、用途に応じた柔軟なフォーム設計が可能になります。

  1. Wordでテキストをミラーリング(反転)表示する方法

    Microsoft Wordでテキストをミラーリング(鏡像化)したい場面は、実は意外と多くあります。ミラーリングとは、テキストを左右に反転させたり、上下逆さまにひっくり返したりすることです。印刷物の裏面加工や、Tシャツなどへのアイロン転写用データ作成の際に必要になることがあります。しかし残念ながら、Wordには通常の状態でテキストを直接反転させる機能が用意されていません。テキストをミラーリングできるのは、そのテキストがテキストボックス内にある場合のみです。つまり、反転したい文字列は必ずテキストボックスに入力する必要があります。なお、テキストボックスを挿入すると枠線が表示されますが、心配はいりま

  2. Googleドキュメントにテキストボックスを挿入する4つの方法【初心者向け完全ガイド】

    テキストボックスは、考えたことを視覚的に整理したり、ページ内の特定のテキストを目立たせたりするのに非常に便利な機能です。特に同僚とドキュメントを共有する際には、テキストボックスを活用することで文書全体がよりフォーマルでプロフェッショナルな印象になります。ただし、Googleドキュメントでは他のワープロソフトと比べて、テキストボックスの追加方法がやや分かりにくくなっています。幸いにも、いくつかの簡単な方法を使えば、誰でもテキストボックスを挿入できます。テキストボックスの中に文字や画像を配置し、それらを自由に移動させることができるので、レイアウトの幅が大きく広がります。Googleドキュメントにテ