Javascript study Part-2
JavaScript study continued. . . . .
PopUp Boxes
There are three types of popup boxes
1)Alert
Is used to make sure the user is interacting properly and also to make sure information comes through the user.
Eg:1(to show alert popup box)
<html>
<head>
<title>Untitled Page</title>
<script type=”text/javascript”>
function display_alert()
{
alert(“I am an alert popup box”+’\n’+”and this is how line breaks are used”);
}
</script>
</head>
<body>
<div>
<input type=”button” onclick=”display_alert()” value=”Show ME” />
</div>
</body>
</html>
2)Confirm
This is used when we want the user to confirm,or if we want him to accept something.This popup will come with 2 options OK or CANCEL.
Eg:2(Confirm popup box)
<html>
<head>
<title>Untitled Page</title>
<script type=”text/javascript”>
function display_confirm()
{
var loy=confirm(“Press a button”);
if (loy==true)
{
document.write(“You pressed OK!”);
}
else
{
document.write(“You pressed Cancel!”);
}
}
</script>
</head>
<body>
<div>
<input type=”button” onclick=”display_confirm()” value=”Show ME” />
</div>
</body>
</html>
3)Prompt Box
Is used when we want the user to be prompted before entering a page.This restricts the user from continuing without giving out a data.The prompt box is having 2 options “OK” or “CANCEL” ,OK will return the value in the box and CANCEL returns null.
Eg:3(Prompt box)
<html>
<head>
<script type=”text/javascript”>
function display_prompt()
{
var name=prompt(“Please enter your name”);
document.write(“Hello ” + name + “Hope this helps you”);
}
</script>
</head>
<body>
<input type=”button” onclick=”display_prompt()” value=”Display a prompt box” />
</body>
</html>
Notes:
Try these codes in visual studio and find the results,this code works if you save as html also,but “document.write” is not working dont know why.
FUNCTIONs In JavaScript
Function can be placed inside the “head” or “body” ,But to make sure it is read and loaded it is wise to place the function inside the “head” tag.A function contains a code which is executed on its call or in the trigger of an event.Eg:1,2,3 consists of functions.
Function Definition:
Syntax: for parameterised function
Function functionname(var1,var2)
{
statements
}
For a function with no parameters the function name is followed by an opening and closing parenthesis.
Syntax:
Function functionname()
{ }
Eg:4How to use a return statement in a function…
<html>
<head>
<script type=”text/javascript”>
function myFunction()
{
var name=prompt(“Entr name”);
return (name);
}
</script></head>
<body>
<script type=”text/javascript”>
document.write(myFunction());
</script>
</body>
</html>
Try….Catch
Another important thing i would like to mention in here is use of try & catch in JavaScript.
The try…catch statement allows us to debug a code for errors. The try block contains the code to be run, and the catch block contains the code to be executed if an error occurs.
Eg:5(For try….catch)
<html>
<head>
<script type=”text/javascript”>
var msg=”";
function message()
{
try
{
adddlert(“Welcome guest!”);
}
catch(err)
{
msg=”There was an error on this page.\n\n”;
msg+=”Error description: ” + err.description + “\n\n”;
msg+=”Click OK to continue.\n\n”;
alert(msg);
}
}
</script>
</head>
<body>
<input type=”button” value=”View message” onclick=”message()” />
</body>
</html>
In the above eg: inside the “try” block the “alert” is mispelled,which will result in showing the alert message inside the “catch” block.Correct it and check it once more.And find the difference.
Goto Prev Next
Related posts:
Wow this is a great resource.. I’m enjoying it.. good article
Leave your response!