Изменение поля в зависимости от input?

Question

[Глеб Логинов]

Как можно сделать, чтобы при вводе в input сразу же выводились изменения без нажатия кнопки? Примерно как на сайте https://passwordsgenerator.net/md5-hash-generator/

Comments

[Максим Черябушкин]

https://learn.javascript.ru/events-change
onInput смотрите

[krokoko]

Там исходный код есть ctrl + u

Answer 1

[Дима Турков]

использовать событие input или change, внутри функции выводить нужные вам значение в зависимости от вашей логики

Comments

[Глеб Логинов]

я с jquery мало знаком, можете, пожалуйста, поподробнее описать

Answer 2

[The Wizard of Oz]

<!-------- собственно говоря это сам input  -------->

<input class="input" type="text">

<!-------- элемент в который будут выводиться данные введённые в input  -------->

<p class="element"></p>

const input = document.querySelector(".input");
input.addEventListener("keyup", function (e) {
  const element = document.querySelector(".element");
  element.textContent = e.target.value;
});

Или можно заменить событие keyup на input:

const input = document.querySelector(".input");
input.addEventListener("input", function (e) {
  const element = document.querySelector(".element");
  element.textContent = e.target.value;
});

Comments

[Глеб Логинов]

спасибо

[The Wizard of Oz]

Глеб Логинов, окей.