- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to display value of textbox in JavaScript?
Extract the value from text box using value and can display in paragraph using innerHTML.
Example
Following is the code −
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<body>
Enter your Name:
<input type="text" placeholder="enter your name" id="txtInputData">
<button onclick="displayName()">Click Me</button>
<p id="show_name">
</p>
</body>
<script>
function displayName() {
var originalName = document.getElementById("txtInputData").value;
document.getElementById("show_name").innerHTML = "Your Name is :" + originalName;
}
</script>
</html>To run the above program, save the file name “anyName.html(index.html)”. Right click on the file and select the option “Open with Live Server” in VSCode editor −
Output
This will produce the following output on console −
Now, enter the value into the text box and click the button −
After clicking the button, the output is as follows −
Updated on 09-Nov-2020 06:52:02
- Related Questions & Answers
- How to output JavaScript into a Textbox?
- How to display JavaScript variable value in alert box?
- Display tooltip text while hovering a textbox in jQuery
- JavaScript Submit textbox on pressing ENTER?
- How to save the contents of a Textbox in Tkinter?
- How to display Absolute value of a number in C#?
- How to display output in javascript?
- Parse JSON in JavaScript to display a specific name/value pair?
- How to type in textbox using Selenium WebDriver with Java?
- How to get entered text from a textbox in selenium?
- How to get the value of PI in JavaScript?
- How to display the value of a variable on command line in MySQL?
- How to create a Default Cell Editor with textbox in Java?
- How to get a new API response in a Tkinter textbox?
- How to display the title of a document with JavaScript?
Advertisements