HTML5_html5 チュートリアルのヒントを使用したフォーム検証の簡単な例

HTML5 は、正規表現を受け入れるフォーム要素のパターン属性を提供します。フォームが送信されるとき、この正規表現はフォーム内の値が空でないことを確認するために使用されます。コントロールの値がこの正規表現と一致しない場合は、プロンプト ボックスが表示され、その式は送信されません。提出されています。プロンプト ボックスのテキストは、setCustomValidity メソッドを使用してカスタマイズできます。
たとえば、以下のフォームでは、テキスト ボックスは本土の携帯電話番号のみを入力できます。他のものを入力すると送信できません。
実行

空でないフォームのみが通常の検証を使用することに注意してください。何も入力されない場合、パターンは使用されないため、必要な支援が必要です。ただし、このコードから表示されるプロンプトは次のようになります:

このようなプロンプトのテキストを理解できるのはサルだけです。したがって、setCustomValidity メソッドを使用して定義された、よりわかりやすいプロンプト テキストも必要です。
走る

無効なイベントは、テストが通過しない場合はテーブルの送信を開始する前に発生する可能性があります。一方、送信時にすべての要素が有効であるかどうかを確認することもできます。
上の例では、コントロールに直接設定する固定の提案はあまり良くありませんが、場合によってはより詳細な提案情報が必要になる可能性があります。これらの動作は、プログラムのテスト後に CustomValidity を設定することによって実行できます。