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.
Start Creating a stunning, Flash website. It's easy and free!
Wix is a revolutionary web design tool that provides you with a free, simple,
drag & drop editing platform to create your own professional and beautiful website.
Over 2 Million users have created their website with Wix.
Now create yours!
 |
W3Schools' Online Certification Program
The perfect solution for professionals who need to balance work, family, and career building.
More than 4500 certificates already issued!
|
The HTML Certificate documents your knowledge of HTML, XHTML, and CSS.
The JavaScript Certificate documents your knowledge of JavaScript and HTML DOM.
The XML Certificate documents your knowledge of XML, XML DOM and XSLT.
The ASP Certificate documents your knowledge of ASP, SQL, and ADO.
The PHP Certificate documents your knowledge of PHP and SQL (MySQL).
| 
