Атрибут enterkeyhint

Глобальный атрибут enterkeyhint говорит браузеру на устройствах с экранной клавиатурой, каким будет внешний вид кнопки ввода. Указывается для элементов управления формой (например, <input> или <textarea>) или для любых элементов, у которых установлен атрибут contenteditable.

        
          
          <input type="text" enterkeyhint="search"><p contenteditable enterkeyhint="enter"></p>
          <input type="text" enterkeyhint="search">

<p contenteditable enterkeyhint="enter"></p>

        
        
          
            
            Скопировать
            Скопировано
            Не удалось скопировать
          
        
      

Атрибут enterkeyhint принимает одно из следующих значений:

Значение по умолчанию. Метка будет изменена на текст return или иконку ↵. Означает переход на новую строку.

Метка изменится на текст done или иконку ✓. Означает, что больше нечего вводить и виртуальная клавиатура закроется.

Метка изменится на текст go или иконку →. Означает переход к следующему целевому объекту введённого текста.

Метка изменится на текст next или иконку ⇥. Означает переход к следующему полю ввода.

Метка изменится на текст return или иконку ⇤. Означает переход к предыдущему полю ввода.

Метка изменится на текст search или иконку 🔍. Означает переход к результатам поиска.

Метка изменится на текст send. Означает отправку текста.

При работе с формами, для улучшения пользовательского опыта, у элементов управления указывают атрибут inputmode, который устанавливает тип виртуальной клавиатуры. Чтобы сделать этот опыт ещё лучше, можно использовать атрибут enterkeyhint. Он позволит выбрать метку действия для клавиши ввода (в зависимости от браузера это может быть текст или иконка). Это даст пользователю характерную подсказку о том, какое действие ожидать после нажатия.

Посмотрите на смартфоне или планшете, как будет изменяться клавиша ввода в каждом из полей:

💡 Если атрибут enterkeyhint не указан, пользовательский агент использует контекстную информацию из атрибутов inputmode, type или pattern для отображения подходящего значения.
💡 Несмотря на значения next и previous, клавиша enter всё равно отправит форму. Поэтому лучше использовать их там, где пользователь просто переходит между полями.