When entering data in the input field at the bottom I get what I wrote. It is necessary that before entering the value VALUE appears at the bottom, and after editing INPUT, a new text appears. Tell me, how can this be done?

<input type="text" class="mytext" value="Пример"> <p id="contenInput"></p> <script> $(document).ready ( function(){ $(".mytext").keyup(function() { $('#contenInput').text($(".mytext").val()); }); }); </script> 
  • It is necessary that when you enter in the "online" mode, the text is displayed in that de <p>? - Red Woolf
  • @RedWoolf yes, in real time - bakusite 8:51 pm

2 answers 2

 $(document).ready ( function(){ $(".mytext").bind("change keyup input", function() { $('#contenInput').text($(".mytext").val()); }); $('#contenInput').text($(".mytext").val()); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" class="mytext" value="Пример"> <p id="contenInput"></p> 

  • But the value of VALUE appears only after I click on the input area - bakusite
  • @bakusite explain what you want, what it means "to appear below before entering ..." - Igor
  • So that when you open the page, both in the Input itself and under it, in <p id = "contenInput"> </ p>, the value is VALUE, but after its change it was changed to another text - bakusite
  • Yes) Fine, works! - bakusite

Can be done by interval

 <input type="text" class="mytext" value="Пример"> <p id="contenInput"></p> <script> $(document).ready ( function(){ setInterval(function() { $('#contenInput').text($(".mytext").val()); }, 100); }); </script>