1. ホーム
  2. html

[解決済み] HTML5フォーム検証のデフォルトのエラーメッセージを変更または削除するにはどうすればよいですか?

2022-04-27 10:24:11

質問

例えば、私は textfield . このフィールドは必須で、数字だけが必要で、値の長さは10でなければなりません。長さが5である値を入力してフォームを送信しようとすると、デフォルトのエラーメッセージが表示されます。 Please match the requested format

<input type="text" required="" pattern="[0-9]{10}" value="">

  1. HTML 5のフォーム検証エラーのデフォルトメッセージを変更するにはどうしたらよいですか?
  2. 1.ができるのであれば、プロパティファイルを作成し、そのファイルに独自のエラーメッセージを設定する方法はありますか?

解決方法は?

これは、JavaScriptによる解決方法です。

 <input type="text"
    pattern="[a-zA-Z]+"
    oninvalid="setCustomValidity('Please enter Alphabets.')"
    onchange="try{setCustomValidity('')}catch(e){}" />

onchange"イベントは、無効な入力データを設定した後、入力を訂正してフォームを再送信するときに必要です。 Firefox、Chrome、Safariでテストしてみました。

しかし、モダンブラウザの場合。

モダンブラウザでは、検証のためのJavaScriptは必要ありませんでした。 このようにすればいいのです。

<input type="text"
    pattern="[a-zA-Z]+"
    title="Please enter Alphabets."
    required="" />