On this page:
Just changing the state of a form input (like a radio button) must not cause anything surprising to happen, like submitting a form, significantly changing the content on the page, or moving the keyboard focus.
Changing the state of any user interface component (like a dropdown or a checkbox) must not automatically cause unexpected changes of context such as the following – unless the user has been advised of what was going to happen beforehand:
Such changes only occur when initiated by the user (e.g. upon activation of a button or link).
As soon as a user has entered a certain number of characters in a text input field, automatically moving the keyboard focus to the next text input field. (This often happens for things like bank sort codes, National Insurance or phone numbers, when the numbers need to be entered across several text input fields).
Moving the user to a new page as soon as they’ve selected an option in a
select element (which is the native dropdown component in HTML).
With some Operating Systems and some implementations of radio buttons and dropdowns, this can cause each option to become selected in turn.
3.2.2 On Input: Changing the setting of any user interface component does not automatically cause a change of context unless the user has been advised of the behavior before using the component. (Level A)
See the W3C’s detailed explanation of this guideline with techniques and examples.
Don’t design interactions where entering a certain number of characters in a text field automatically moves the keyboard focus to another text field, unless users have been told beforehand.
If you want users to input things like phone numbers, National Insurance numbers or bank sort codes across several input fields, set a limit to the number of characters that each field can receive and let the users move the keyboard focus manually to each input field.
selectelements as navigation menus
selectelements as a navigation menu, unless changing the value of the
selectelement doesn’t automatically trigger navigation.
submitevent (for example if you’re validing on an input field’s
blurevent), make sure that the validation script does not move the keyboard focus.
submitevents. Submitting on
blurevents leads to confusing announcements for screen reader users.