The HTML enterkeyhint attribute
In short
The HTML enterkeyhint attribute tells on-screen keyboards which label or icon to show on the Enter key, for example search, send, go, next or done. It is a global attribute used on form fields and editable elements to make multi-step forms feel native on mobile.
Overview
The enterkeyhint attribute customizes the action key on virtual keyboards so it matches what pressing Enter will actually do. A search box can show "Search", a chat field "Send", and a step in a wizard "Next".
It is purely a presentation hint for soft keyboards; it does not change behavior, so you still handle the key press in your own code. Pair it with inputmode for the best mobile typing experience.
Values
| Value |
|---|
| enter | done | go | next | previous | search | send |
Example
<input type="search" enterkeyhint="search" placeholder="Search…" style="padding:8px; width:100%;">Best practices
- Use inputmode to bring up the right on-screen keyboard (numeric, email, and so on).
- Set autocapitalize appropriately: off for names and codes, sentences for prose.
- These are hints; do not rely on them for validation.
- Test on real mobile devices, where most of these take effect.
Frequently asked questions
What does the enterkeyhint attribute do?
Hints which action label the virtual keyboard should show on its Enter key.
Is enterkeyhint guaranteed to work?
No. It is a hint to on-screen keyboards, which may show a different action label or ignore it; it has no effect on a physical keyboard.
Does enterkeyhint change what the Enter key does?
No. It only changes the label or icon on the virtual keyboard's action key. You still handle the keypress or form submission yourself.
Is enterkeyhint a global attribute?
Yes, it is a global attribute, so it can be set on any HTML element, most usefully on editable and form fields.
