Как работать с событием ENTER + INPUT?

Question

[Helig]

Помогите отправлять сообщение, по нажатию кнопки Enter.

<input type = "text" style = "width: 100%;" id = "otprav" name = "otprav" />
<button type = "submit" class = "btn btn-default" id = "btnotprav" onclick = "buttonotprav()" style = "width: 100%;" >Отправить</button>

function buttonotprav () {
...
}

- Это то, что есть. Как осуществить отправку по нажатию Enter'a?

Answer 1

[profesor08]

Учи основы форм!

<form>
   <input type="text" name="otprav">
   <button>Отправить</button>
</form

document.querySelector("form").addEventListener("submit", function(e) {
	e.preventDefault();
  const data = new FormData(this);
  alert("Учи основы форм! \n MSG: " + data.get("otprav"));
});

Comments

[Helig]

Почти сработало! Скажи как сделать без перезагрузки страницы пожааалуйста! И я тебя сразу же наконец отмечу как решение.

[profesor08]

e.preventDefault();
Это и оно и есть.

[Helig]

profesor08: всеравно перекидывает на другую страницу, добавляет (?otprav=) в поисковой строчке. В итоге вся моя программа начинается с начала. Я довлял себе настройку фокуса, но не думаю, что это связано.

Answer 2

[kulaeff]

Если под кнопкой Enter имеется ввиду клавиша Enter, то так:

$('#otprav').on('keydown', function(e) {
  // Если был нажат Enter
	if (e.which === 13) {
    buttonOtprav()
  }
})