Атрибут 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 всё равно отправит форму. Поэтому лучше использовать их там, где пользователь просто переходит между полями.