適用 (対象)
HTML 及び XHTMLL
これは達成基準 3.2.2: 入力時 (失敗) に関する達成方法である。
解説
利用者がすべてのフィールドに入力し終わるか、最後のフィールドからフォーカスが外れると、自動的に送信されるように設計されたフォームが多くある。この方法には二つの問題がある。まず、障害のある利用者で前後関係の情報を必要としている人が、フォームの記入方法や、他のテキストに移動するためにフィールドからフォーカスをはずしてしまい、意図せずに送信してしまう場合がある。もう一つは、いくつかのフォームの要素において、それぞれの項目の値がキーボードで移動している間に変化してしまい、誤って送信してしまうことである。送信ボタン及び Enter キーによる標準的なフォームのふるまいに依存している方がよい。
事例
例 1
この失敗例では、利用者が三つのフィールドで構成される電話番号のフォームの最後のフィールドから離れたときにフォームを送信する。フォームは、利用者が編集を終えてフィールドから離れたときに、たとえタブ順序で前に戻ったとしても送信される。開発者はフォームを送信するためにこの達成方法を使用すべきではなく、送信ボタンやフォームのデフォルトのふるまいである、利用者がテキストフィールドで Enter キーを押したときに送信されるようにすべきである。
<form method="get" id="form1"> <input type="text" name="text1" size="3" maxlength="3"> - <input type="text" name="text2" size="3" maxlength="3"> - <input type="text" name="text3" size="4" maxlength="4" onchange="form1.submit();"> </form>
例 2
この失敗例は、利用者がメニューから項目を選択すると、事前の警告なくフォームを送信する。メニューから項目が選択されると、直ちにフォームが送信される。キーボード利用者は、最初のメニュー項目を超えて移動することができない。全盲の利用者や手の震えがある利用者は、ドロップダウンメニューから項目を選ぶときに間違いを起こしやすく、修正する前に間違った行き先に連れて行かれてしまう。
<form method="get" id="form2">
<input type="text" name="text1">
<select name="select1" onchange="form2.submit();">
<option>one</option>
<option>two</option>
<option>three</option>
<option>four</option>
</select>
</form>検証
手順
- ページ上のすべてのフィールドに、上から順にデータを入力する。
- 最後のフィールドにデータを入力して抜け出す (タブで抜ける)。
- 最後のフィールドから離れることで、コンテキストの変化が起こるかどうかを確認する。
期待される結果
- #3 の結果が真である場合、この失敗例の条件は適用され、コンテンツは達成基準の失敗となる。