JAVASCRIPT Input
JAVASCRIPT
User input in JavaScript is taken by the browser's built-in window.prompt method.
JavaScript Input
➔ JavaScript can manage and handle user input using window.prompt method of the browser.
➔ window.prompt is an input type dialog box where the user can type their input as a string.
➔ JavaScript can store the input value provided by the user in a variable for later processing.
➔ All input taken from the user through the window.prompt method is of type string, and must be explicitly converted if necessary.
➔ In JavaScript, the prompt function is a method of the window object, and in a web browser, the window object is in the global scope or global space, so the properties and methods of the window object can be accessed directly or by explicitly referring to the window object.
Syntax
<script>
prompt("Please enter a value", "Default Value");
</script>
Syntax
<script>
prompt("Please enter a value");
</script>
Syntax
<script>
prompt();
</script>
JavaScript input value is string.
Example
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Input Example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
</head>
<body>
<h3>JavaScript Input Example</h3>
<p>If necessary convert user input explicitly.</p>
<p>Result is: <span id="demoid"></span></p>
<script>
var value1 = window.prompt("Please enter a value", 50);
//var value1 = parseInt(window.prompt("Please enter a value", 50));
document.getElementById("demoid").textContent = 50 + value1;
</script>
</body>
</html>
Click on the "Try it Now" button to see how it works.
JavaScript input add two number:
Example
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Input Example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
</head>
<body>
<h3>JavaScript Input Example</h3>
<p>User inputs are converted to numbers and add two numbers.</p>
<p>Summation is: <span id="demoid"></span></p>
<script>
var value1 = parseInt(window.prompt("Please enter number"));
var value2 = parseInt(window.prompt("Please enter number"));
document.getElementById("demoid").textContent = value1 + value2;
</script>
</body>
</html>
Click on the "Try it Now" button to see how it works.
JavaScript input:
Example
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Input Example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<style>
button {
width: 120px;
height: 40px;
}
</style>
</head>
<body>
<h3>JavaScript Input Example</h3>
<p>User input are added using button click event.</p>
<p>Summation is: <span id="demoid"></span></p>
<button onclick="add()">Add numbers</button>
<script>
var x = parseInt(window.prompt("Please enter number"));
var y = parseInt(window.prompt("Please enter number"));
function add() {
document.getElementById("demoid").textContent = x + y;
}
</script>
</body>
</html>
Click on the "Try it Now" button to see how it works.