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

HTMLのformnovalidate属性とは?使い方をわかりやすく解説

formnovalidate属性とは

HTMLのformnovalidate属性は、1つのフォームに複数の送信ボタンが存在する場合に特に便利な属性です。この属性を特定の送信ボタンに指定すると、そのボタンから送信したときに限り、入力内容の検証(バリデーション)をスキップできます。

formnovalidate属性は、<form>要素が持つnovalidate属性を上書きする役割を持ちます。novalidate属性もブール型(真偽値)の属性で、こちらを指定するとフォーム全体のバリデーションが無効になります。

注意: formnovalidate属性は、Internet ExplorerおよびSafariではサポートされていません。Internet Explorerはすでにサポートが終了していますが、Safari向けのサイトを開発する場合は動作に注意が必要です。

HTMLのformnovalidate属性とは?使い方をわかりやすく解説

novalidate属性との違い

属性指定する場所効果
novalidate<form>要素フォーム全体のバリデーションを無効化する
formnovalidate送信ボタン(type="submit" など)そのボタンで送信した場合のみバリデーションをスキップする

使用例

以下のコードを実行すると、HTMLでformnovalidate属性を使う方法を実際に確認できます。通常の「送信」ボタンを押すと入力値が検証されますが、「検証なしで送信」ボタンを押した場合は、バリデーションを行わずにそのままフォームが送信されます。

<!DOCTYPE html>
<html>
   <head>
      <title>HTML formnovalidate属性</title>
   </head>
   <body>
      <form action = "new.php" method = "get">
         順位 <input type = "number" name = "rank"><br>
         <input type = "submit" value = "送信"><br>
         <input type = "submit" formnovalidate = "formnovalidate" value = "検証なしで送信">
      </form>
   </body>
</html>

このように、下書き保存など「未入力のままでも送信したい」ケースと、通常の厳密な入力チェックが必要なケースを、同じフォーム内で使い分けたい場合にformnovalidate属性は非常に有効です。

  1. HTMLのmultiple属性とは?複数選択を可能にする使い方を徹底解説

    HTMLのmultiple属性は、ユーザーが複数の値を選択・入力できるようにするための属性です。この属性はブール型(真偽値)属性であり、<input>要素と<select>要素の両方で使用できます。特に、HTMLフォームで複数のファイルをアップロードしたい場合にmultiple属性が活躍します。また、この属性は「email」および「file」タイプの入力フィールドに対応しています。multiple属性の主な特徴fileタイプ:ファイル選択ダイアログで複数のファイルを同時に選択可能になります(CtrlキーやShiftキーを押しながらクリック)。emailタイプ:カンマ区切

  2. HTMLのlist属性とは?datalist要素で入力候補を表示する方法を解説

    HTMLのlist属性とはHTMLでは、<datalist>要素を使用して、あらかじめ定義された選択肢のリストを作成できます。このリストは<input>要素(入力欄)に対して適用され、ユーザーが文字を入力すると、定義済みの選択肢が候補として自動的に表示されます。<input>要素のlist属性は、対応する<datalist>要素のidを参照することで、入力欄と選択肢リストを関連付けます。このlist属性は、HTML5で新たに導入された機能です。list属性の基本的な使い方list属性を使うには、以下の2つのステップを行います。<datali