JavaScript Try...Catch Statement
The try...catch statement allows you to test a block of code
for errors.
JavaScript - Catching Errors
When browsing Web pages on the internet, we all have seen a JavaScript alert box telling us there is a runtime error and asking "Do you wish to debug?".
Error message like this may be useful for developers but not for users. When users see errors, they often leave the Web page.
This chapter will teach you how to catch and handle JavaScript error messages, so you don't lose your audience.
The try...catch Statement
The try...catch statement allows you to test a block of 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.
Syntax
try
{
//Run some code here
}
catch(err)
{
//Handle errors here
} |
Note that try...catch is written in lowercase letters. Using uppercase letters will generate a JavaScript error!
Examples
The example below is supposed to alert "Welcome guest!" when the button is clicked. However, there's a typo in the
message() function. alert() is misspelled as adddlert(). A JavaScript error occurs. The catch block catches the error and executes a custom code
to handle it. The code displays a custom error message informing the user what happened:
Example
<html>
<head>
<script type="text/javascript">
var txt="";
function message()
{
try
{
adddlert("Welcome guest!");
}
catch(err)
{
txt="There was an error on this page.\n\n";
txt+="Error description: " + err.description + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
}
}
</script>
</head>
<body>
<input type="button" value="View message" onclick="message()" />
</body>
</html> |
Try it yourself »
|
The next example uses a confirm box to display a custom
message telling users they can click OK to continue viewing the page or click
Cancel to go to the homepage. If the confirm method returns false, the user
clicked Cancel, and the code redirects the user. If the confirm
method returns true, the code does nothing:
Example
<html>
<head>
<script type="text/javascript">
var txt="";
function message()
{
try
{
adddlert("Welcome guest!");
}
catch(err)
{
txt="There was an error on this page.\n\n";
txt+="Click OK to continue viewing this page,\n";
txt+="or Cancel to return to the home page.\n\n";
if(!confirm(txt))
{
document.location.href="http://www.w3schools.com/";
}
}
}
</script>
</head>
<body>
<input type="button" value="View message" onclick="message()" />
</body>
</html> |
Try it yourself »
|
The throw Statement
The throw statement can be used together with the try...catch statement, to
create an exception for the error. Learn about the throw statement in the next
chapter.
Make your web applications look like a million bucks
|
|
Most web applications today use boring methods to present data to their viewers using grids or simple HTML tables. FusionCharts induces "life" into the web applications by converting monotonous data into lively charts, gauges & maps.
FusionCharts works with all technologies like ASP, ASP.NET, PHP, ColdFusion, Ruby on Rails, JSP, HTML pages etc.
and connects to any database to render animated & interactive charts. It takes less than 15 minutes and no expertise
whatsoever to build your first chart and just a glance of it to captivate your audience. This fact is endorsed by our
12,000 customers and 150,000 users which include a majority of the Fortune 500 companies.
And yeah, your applications could look like a million bucks by spending just $69.
So go ahead, download your
copy of FusionCharts and start "wow-ing" your customers now!
|
|