keyup()
methodYou can use the jQuery keyup()
method in combination with the val()
and text()
method to simultaneously update the <div>
element content, while user writing the text in a <textarea>
.
Let's try out the following example to understand how it basically works:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Auto Update Div with Content from Textarea</title>
<style>
.output{
padding: 10px;
min-height: 50px;
border: 1px solid #e4e4e4;
}
</style>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
$(document).ready(function(){
$("#myTextarea").keyup(function(){
// Getting the current value of textarea
var currentText = $(this).val();
// Setting the Div content
$(".output").text(currentText);
});
});
</script>
</head>
<body>
<form>
<textarea id="myTextarea" rows="5" cols="60" placeholder="Type something here..."></textarea>
</form>
<div class="output"></div>
</body>
</html>
Hi, My name is Harsukh Makwana. i have been work with many programming language like php, python, javascript, node, react, anguler, etc.. since last 5 year. if you have any issue or want me hire then contact me on [email protected]
How To Set Header In maatwebsite/excel Export In Laravel
Today, we are share with you how to set...How to Remove a Specific Item from an Array in JavaScript
Use the splice() Method You can use t...How to convert URL to array in PHP
An URL is the string of many data. URL c...How to Validate Textbox to Accept only Characters in Javascript
In this article, we will see how to allo...How to Files Upload with Progress Bar Help of jQuery Ajax & PHP
The file upload feature is the most used...