enterkeyhint
enterkeyhint changes the label or intent of the virtual keyboard's Enter key on supporting devices. It helps the keyboard better match the next action in a form flow.
Overview
enterkeyhint changes the label or intent of the virtual keyboard's Enter key on supporting devices. It helps the keyboard better match the next action in a form flow.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 77 | 79 | 94 | 13.1 | 77 | 13.4 | |
| DOM API | ||||||
| The enterKeyHint property is an enumerated property defining what action label (or icon) to present for the enter key on virtual keyboards. It reflects the enterkeyhint HTML global attribute and is an enumerated property, only accepting the following values as a string: | 77 | 79 | 94 | 13.1 | 77 | 13.4 |
Syntax
<input type="search" enterkeyhint="search" placeholder="検索...">
<input type="text" enterkeyhint="send" placeholder="メッセージ">
<input type="text" enterkeyhint="go" placeholder="URL">Live demo
Message composer
Use enterkeyhint to suggest the action label shown on the virtual keyboard.
Search and go labels
Compare enterkeyhint values for search, go, and done in one layout.
Use cases
Mobile forms
Guide the soft keyboard toward the next step when users move through short input sequences.
Search fields
Set the keyboard action to search so the on-screen affordance matches the field's intent.
Cautions
- Treat enterkeyhint as a hint, not a guarantee; behavior varies by keyboard and platform.
- The field still needs clear visible labels and submit behavior regardless of the key label.
Accessibility
- Use it to reinforce, not replace, the meaning of the control for screen reader and switch users.
- Ensure keyboard users can still submit or advance without relying on a touch keyboard.
Related links
Powered by web-features