How to display the value of the input in DIV in real-time with jQuery
In this tutorial, we are going to see how to display the value of the input in DIV object in real-time with jQuery. You can bind the event during input to a text box using the on() method to detect any modification to it.
The following example displays the entered value in real-time when you type something in the input text.
How to display the value of the input in DIV in real-time with jQuery
<!DOCTYPE html> <html> <head> <title>Display the value of the input in DIV object in real-time</title> <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> <script> $(document).ready(function(){ $("#inText").on("input", function(){ $("#output").text($(this).val()); }); }); </script> </head> <body> <p><input type="text" placeholder="Enter a value here" id="inText"></p> <div id="output"></div> </body> </html>
Result |
---|