Select Box

HTML <select> boxes inherently have "typeahead" support allowing you to accessibly select options based on typing them. For example, set focus to the <select> and type "4.2" to jump to the Reuptuation Builder Walkthrough.

<optgroup> tags are used and nested to give structure to the available <options>.


Datalist

Enter anything

Or choose

HTML <datalist> boxes inherently have "typeahead" support allowing you to type into a text input to filter a list. For example, set focus to the <datalist> and type "3.2" to jump to the Functions Section.

<optgroup> tags are used and nested to give structure to the available <options>.

Browser support for <datalist> is still poor. See caniuse.

Note: While HTML Datalists filter a typeahahead list, they allow users to type any value. Validation, if needed, must be done manually.

Datalist in Firefox
HTML5 Datalist shown in Firefox