Alerts and Functions in JavaScript - Using Alerts, Prompts, and Confirm Boxes
JavaScript Alerts
In this tutorial, I will explain all there is to know about alerts and prompts in JavaScript. We will also learn about functions, including how and when they should be used.
Alert, Confirmation, and Prompt boxes are the most basic kinds of interactivity elements you can add to your JavaScript code.
Alert Boxes:
Alert boxes are to be used when you just want to pass on some information to the user. The user will be alerted with an alert box with whatever information you want to pass on and then he can click OK and go back to the page. The Alert box doesn’t return any values, unlike the Confirm and Prompt boxes.
The standard syntax for an alert box is
alert(“Hi, This is an alert box”);
Confirm Boxes:
Confirm boxes are generally used when you need confirmation from the user regarding some specific action. The confirmation box is displayed with text on it and the user can then click OK or Cancel. The return value is stored in a variable. If the user clicks OK, the value returned is true. If he clicks Cancel, the value returned is false.
Syntax for Confirm Boxes:
var returnvalue = confirm(“Hi, This is a confirmation box”);
Prompt Boxes:
While alert boxes are used to notify the user and confirm boxes are used to get a yes / no response, prompt boxes can be used to get text input from the user. The prompt box can be used to display information to the user and get a response. It has two buttons - OK and Cancel, and a textbox. If the user enters some text and presses OK, the input is stored in the return variable. If the user clicks Cancel, a null value is returned. You can also specify a default value in the textbox.
Basic Syntax for Prompt Boxes:
var returnvalue = prompt(“Hi, This is a Prompt box”, “This is the default value of the prompt box”);
Here is some code which will demonstrate all types of alert boxes.
alert(“Hi, This is an alert box”);
var returnvalue1 = confirm(“Hi, This is a confirmation box”);
document.write(“The confirm box returned the value " + returnvalue1 + "
“);
var returnvalue2 = prompt(“Hi, This is a Prompt box”, “This is the default value of the prompt box”);
document.write(“The prompt box returned the value " + returnvalue2 + "
“);
Functions:
Functions are blocks of code which are executed when an event triggers the function or when the function is called in the code after its definition. A function can be called at any point after it is defined. It can return values and accept parameters to operate on. Functions are generally used when the same code block is to be used at many points in the program.
Syntax:
function functionname(variable1, variable2)
{
function body
return returnvariable;
}
Here’s an example of a function
var a = 2;
var b = 4;
var addvalue;
function addvar(var1,var2)
{
document.write(“Function to compute the sum of two variables and return it”);
return var1+var2;
}
addvalue= addvar(a,b);
document.write(“The sum of a and b is “+addvalue);
This post is part of the series: JavaScript - Tutorials for Beginners
This collection contains several basic JavaScript tutorials for beginners. It explains fundamental concepts, such as operators, variables, loops, events, errors and conditional statements in JavaScript. It assumes no prior programming knowledge.