Scribd
Upload
241 views

Javascript Pop Up Box

JavaScript has three types of popup boxes: alert boxes, confirm boxes, and prompt boxes. Alert boxes display a message that must be closed by clicking OK. Confirm boxes display a message and require the user to click either OK or Cancel. Prompt boxes display a message and input field, requiring the user to enter a value and click either OK or Cancel. All boxes can be created using the window.alert(), window.confirm(), and window.prompt() methods.

Uploaded by

Anshika Tiwari
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
241 views

Javascript Pop Up Box

JavaScript has three types of popup boxes: alert boxes, confirm boxes, and prompt boxes. Alert boxes display a message that must be closed by clicking OK. Confirm boxes display a message and require the user to click either OK or Cancel. Prompt boxes display a message and input field, requiring the user to enter a value and click either OK or Cancel. All boxes can be created using the window.alert(), window.confirm(), and window.prompt() methods.

Uploaded by

Anshika Tiwari
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

JavaScript 

Popup Box
JavaScript has three kind of popup boxes: Alert box, Confirm box, and
Prompt box.

Alert Box
An alert box is often used if you want to make sure information comes through
to the user.

When an alert box pops up, the user will have to click "OK" to proceed.

Syntax
window.alert("sometext");

The window.alert() method can be written without the window prefix.

Example
alert("I am an alert box!");

<!DOCTYPE html>

<html>

<body>

<h2>JavaScript Alert</h2>

<button onclick="myFunction()">Try it</button>

<script>

function myFunction() {

alert("I am an alert box!");


}

</script>

</body>

</html>

Confirm Box
A confirm box is often used if you want the user to verify or accept something.

When a confirm box pops up, the user will have to click either "OK" or "Cancel"
to proceed.

If the user clicks "OK", the box returns true. If the user clicks "Cancel", the box
returns false.

Syntax
window.confirm("sometext");

The window.confirm() method can be written without the window prefix.

Example
if (confirm("Press a button!")) {
  txt = "You pressed OK!";
} else {
  txt = "You pressed Cancel!";
}

<!DOCTYPE html>

<html>

<body>

<h2>JavaScript Confirm Box</h2>

<button onclick="myFunction()">Try it</button>


<p id="demo"></p>

<script>

function myFunction() {

var txt;

if (confirm("Press a button!")) {

txt = "You pressed OK!";

} else {

txt = "You pressed Cancel!";

document.getElementById("demo").innerHTML = txt;

</script>

</body>

</html>

Prompt Box
A prompt box is often used if you want the user to input a value before entering
a page.

When a prompt box pops up, the user will have to click either "OK" or "Cancel"
to proceed after entering an input value.

If the user clicks "OK" the box returns the input value. If the user clicks
"Cancel" the box returns null.

Syntax
window.prompt("sometext","defaultText");

The window.prompt() method can be written without the window prefix.


Example
let person = prompt("Please enter your name", "GGITS");
let text;
if (person == null || person == "") {
  text = "User cancelled the prompt.";
} else {
  text = "Hello " + person + "! How are you today?";
}

<!DOCTYPE html>

<html>

<body>

<h2>JavaScript Prompt</h2>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>

function myFunction() {

let text;

let person = prompt("Please enter your name:", "GGITS");

if (person == null || person == "") {

text = "User cancelled the prompt.";

} else {

text = "Hello " + person + "! How are you today?";

document.getElementById("demo").innerHTML = text;

</script>
</body>

</html>

Line Breaks
To display line breaks inside a popup box, use a back-slash followed by the
character n.

Example
alert("Hello\nHow are you?");

<!DOCTYPE html>

<html>

<body>

<h2>JavaScript</h2>

<p>Line-breaks in a popup box.</p>

<button onclick="alert('Hello\nHow are you?')">Try it</button>

</body>

</html>

You might also like