diff --git a/techniques/client-side-script/SCR18.html b/techniques/client-side-script/SCR18.html index 8d98b41c5..5f3adfa89 100644 --- a/techniques/client-side-script/SCR18.html +++ b/techniques/client-side-script/SCR18.html @@ -1,6 +1,6 @@ -
このWCAG 2.2 テクニック集の日本語訳は作業中となっています。WCAG 2.1 達成方法集の日本語訳をご利用いただけます。[ WCAG 2.1 達成方法集 ]
This technique relates to:
このテクニックは、次に関連する:
This technique applies to content that validates user input.
このテクニックは、利用者の入力を検証するコンテンツに適用される。
The objective of this technique is to validate user input as values are entered for each field, by means of client-side scripting. If errors are found, an alert dialog describes the nature of the error in text. Once the user dismisses the alert dialog, it is helpful if the script positions the keyboard focus on the field where the error occurred.
このテクニックの目的は、クライアントサイドのスクリプトによって、各フィールドで利用者が入力する値を確認することである。エラーが見つかった場合、警告ダイアログを表示し、エラーの内容をテキストで示す。警告ダイアログを閉じるとともに、スクリプトによってキーボードフォーカスをエラーが起こったフィールドに移動させれば、それは利用者にとって役立つ。
The following script will check that a valid date has been entered in the form control.
以下のスクリプトは、有効な日付がフォームのコントロールに入力されたかをチェックする。
<label for="date">Date:</label> <input type="text" name="date" id="date" @@ -125,17 +121,17 @@ Example 1: Checking a single control with an event handler Please re-enter the value.');">
The following sample shows multiple controls in a form. The form element uses the onsubmit attribute which creates an event handler to execute the validation script when the user attempts to submit the form. If the validation is successful, the event returns true and the form submission proceeds; if the validation finds errors, it displays an error message and returns false to cancel the submit attempt so the user can fix the problems.
form
onsubmit
true
false
次の例はフォーム内の複数のコントロールを表している。form 要素は、利用者がフォームを送信しようとした際、検証スクリプトを実行するために、イベントハンドラを作成する onsubmit 属性を用いている。検証で問題がない場合、イベントは true を返し、フォームの送信を続行する。検証でエラーが検出された場合は、利用者が問題を修正できるようエラーメッセージを表示し、送信を取り消すために false を返す。
Note
注記
This example demonstrates an alert for simplicity. A more helpful notification to the user would be to highlight the controls with problems and add information to the page about the nature of the errors and how to navigate to the controls that require data fixes.
Although this example uses an onsubmit attribute on the form element for brevity, normal practice is to create a submit event listener when the page is loaded.
この事例は簡潔さのためにアラートを用いて説明している。利用者により役立つ通知は、問題のあるコントロールをハイライトし、エラーの内容とデータの修正が必要なコントロールに移動する方法をページ上に示すことである。
この事例では簡潔さのために form 要素に onsubmit 属性を用いているが、通常であればページがロードした際にフォーム送信用のイベントリスナーを作成する。
Script code:
スクリプトコード:
function validate() { // initialize error message var msg = ""; @@ -163,7 +159,7 @@ Example 2: Checking multiple controls when the user submits the form else { return true; }
Form code:
フォームコード:
<form action="multiple-controls.html" onsubmit="return validate()"> <div> <label for="name">Name:</label> @@ -177,25 +173,25 @@ Example 2: Checking multiple controls when the user submits the form <input type="submit"> </div> </form>
This is demonstrated in the working example of checking multiple controls when the user submits the form.
利用者がフォームを送信したときに複数のコントロールをチェックする動作例にデモがある。
For form fields that require specific input:
特定の入力を必要とするフォームのフィールドに対して:
Please share your ideas, suggestions, or comments via e-mail to the publicly-archived list public-agwg-comments@w3.org or via GitHub
あなたのアイデア、提案、又はコメントを、Google フォーム 又は GitHub で共有してください。
この文書は、2025 年 5 月 21 日付けの Techniques for WCAG 2.2 を、ウェブアクセシビリティ基盤委員会 (WAIC) の翻訳ワーキンググループが翻訳して公開しているものです。この文書の正式版は、W3C のサイトにある英語版です。正確な内容については、W3C が公開している原文 (英語) をご確認ください。この翻訳文書は作業進行中です。また、あくまで参考情報であり、翻訳上の誤りが含まれていることがあります。 +
この翻訳文書の利用条件については、WAICが提供する翻訳文書のライセンスをご覧ください。