List box
List box
Resources
ListBox allows the user to select an item from an array of options. Selected items are visually distinct from nonselected items. To ensure efficient space usage, long lists of items are in a scrolling pane that can provide access to options not immediately visible to the user.
| Key | Function |
|---|---|
| Tab | If focus is above the list, Tab moves focus to one of the following options depending on previous user interaction:
|
| Shift + Tab | If focus is below the list, this action moves focus to one of the following options depending on previous user interaction:
|
| Space / Enter | When focus is on an option, this action selects the option and if the list box is single-select deselects the previously selected option, if any. |
| Up arrow | Up arrow moves focus to the previous option in the list. Focus doesn't wrap. |
| Down arrow | Down arrow moves focus to the next item in the list. Focus doesn't wrap. |
| Page up | When focus is within the dropdown, this action moves focus to the item before the first visible option. |
| Page down | When focus is within the dropdown, this action moves focus to the item after the last visible option. |
| Home | When focus is within the list, Home moves focus to the first option. |
| End | When focus is within the list, End moves focus to the last option. |
| Key | Function |
|---|---|
| Tab | If focus is above the list, Tab moves focus to one of the following options depending on previous user interaction:
|
| Shift + Tab | If focus is below the list, this action moves focus to one of the following options depending on previous user interaction:
|
| Space / Enter | When focus is on an option, this action selects the option and if the list box is single-select deselects the previously selected option, if any. |
| Up arrow | Up arrow moves focus to the previous option in the list. Focus doesn't wrap. |
| Down arrow | Down arrow moves focus to the next item in the list. Focus doesn't wrap. |
| Page up | When focus is within the dropdown, this action moves focus to the item before the first visible option. |
| Page down | When focus is within the dropdown, this action moves focus to the item after the last visible option. |
| Home | When focus is within the list, Home moves focus to the first option. |
| End | When focus is within the list, End moves focus to the last option. |
| Key | Function |
|---|---|
| Tab | If focus is above the list, Tab moves focus to one of the following options depending on previous user interaction:
|
| Shift + Tab | If focus is below the list, this action moves focus to one of the following options depending on previous user interaction:
|
| Space / Enter | When focus is on an option, this action selects the option and if the list box is single-select deselects the previously selected option, if any. |
| Up arrow | Up arrow moves focus to the previous option in the list. Focus doesn't wrap. |
| Down arrow | Down arrow moves focus to the next item in the list. Focus doesn't wrap. |
| Page up | When focus is within the dropdown, this action moves focus to the item before the first visible option. |
| Page down | When focus is within the dropdown, this action moves focus to the item after the last visible option. |
| Home | When focus is within the list, Home moves focus to the first option. |
| End | When focus is within the list, End moves focus to the last option. |