References

Beginner-friendly references for web development, with live, editable examples.

The HTML enterkeyhint attribute

Global attribute Works on every element All modern browsers Updated
Quick answer

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

Live 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.
Are these attributes guaranteed to work?
No. They are hints that browsers and on-screen keyboards may honor or ignore, especially on desktop.
Which elements do they apply to?
They are global attributes, but they mainly affect editable and form fields.
Is enterkeyhint a global attribute?
Yes — it is a global attribute, so it can be set on any HTML element (it is a global attribute), most usefully on editable and form fields.