JavaScript Popup Boxes

 JavaScript has some built-in methods or functions for displaying popup messages for various purposes. So, without further delay; let’s learn about JavaScript popup boxes.

JavaScript Popup Boxes

JavaScript Popup boxes are used in JavaScript to display information or messages to the user on your website. It is also known as a dialogue box.

You can use a popup box to show some alert or warning message, take confirmation from the user and get input from the user. The user cannot proceed to see other web pages or perform some actions on your site until the popup box is closed by him.

Types of Popup boxes in JavaScript

Alert Box

An alert box is the first type of JavaScript Popup Boxes. This popup or dialog box is used to display an alert or warning message to the user. To proceed, the user must click “OK.”
We use the alert() method of the window object to show an alert dialog box in JavaScript.

Syntax
window.alert(message);
or
alert(message);

Confirm Box

A confirm box is the second type of JavaScript Popup Boxes. It is a popup box used to get permission or confirmation from the user. There are two buttons in the confirm box: “OK” and “Cancel”. To continue, the user must select either “OK” or “Cancel”. It returns true if the user clicks on the “OK” button, otherwise, then false is returned.

In JavaScript, we use the window’s object confirm() method to take consent from the user.

Syntax
window.confirm(message)
or
confirm(message)

Prompt Box

A Prompt box is the third type of JavaScript Popup Boxes. It is a dialog or popup box which is used to get some input from the user before allowing them to move on to the next step. This popup box has an input field, “OK” and “Cancel” buttons.

We use the prompt() method of the window object in JavaScript to take input from the user. The prompt() method takes two parameters: the message you want to display and the default value. The value returned by prompt() is stored in a variable and used to execute some action.

Syntax
window.prompt(your message,default_value)
or
prompt(your message,default_value)
The default_value parameter is optional.

Summary

  • The JavaScript Popup Boxes is also called a dialog box.
  • An alert box is used to display a popup message to the user. It has only an “OK” button.
  • A confirm box is used to take the user’s confirmation or consent to perform the next step. It has two buttons: ”OK” and “Cancel”.
  • A prompt box is a kind of pop-up box that is used to get the user input for future use. It has an input field, “OK” and “Cancel” buttons.

Related Posts

What are custom events in JavaScript?

Custom events are the events that allow you to decouple the code you want to run after a specific piece of code runs. There are various in-built events…

How to use nested for loop in JavaScript?

We use the for loop statement of JavaScript for repeating a set of statements inside the loop body a specified number of times. A nested for loop, as the…

What are the basic rules for JavaScript parameters?

A JavaScript function is a code that performs a particular task. The function parameters are the name list in the function definition. Parameters are also known as…

How to stop refreshing the page on submit in JavaScript?

Using event.preventDefault() to stop page refresh on form submit In this section, we will see how to use event.preventDefault() to stop page refresh on form submission. The event.preventDefault() restricts the default…

Target a Window Using JavaScript or HTML

TARGET attribute of HTML A link’s opening named frame or window is specified using the Target attribute of the <a> anchor tag. The concluding </a> tag in…

What is the role of deferred scripts in JavaScript?

Since JavaScript is a loosely typed language, you are not required to correctly predict the kind of data that will be kept in a variable. Depending on the information…