How to duplicate text entered in a form?

Question

JavaScript

Greetings!
Tell me there is fom and it has text fields with a phone number, how to make it so that when entering data into the form, they are duplicated elsewhere on the page, say at the bottom of the site page.

Answer 1

You hang an input event handler on the input field, in which you write value where you need it. Something like this:

<form>
  <div><input data-output="#output1"></div>
  <div><input data-output="#output2"></div>
  <div><textarea data-output="#output3"></textarea></div>
</form>

<div id="output1"></div>
<div id="output2"></div>
<div id="output3"></div>

document.querySelector('form').addEventListener('input', function(e) {
  const output = document.querySelector(e.target.dataset.output);
  if (output) {
    output.innerHTML = e.target.value;
  }
});