|
|
|
Creating custom JavaScript error dialog boxes
Time for a little fun. In this closing section, lets see how to create
a custom error
boxe that replace the default one in the event of a js error. This box,
unlike the default box, pops up only once, even if there are multiple errors
on the page:
<html>
<head>
<style type="text/css">
.errordialog{
position:absolute; width:100%; border-bottom:1px solid black;
background:lightyellow; left:0; top:0; padding: 3px 0; text-indent: 5px;
font: normal 11px Verdana;
}
</style>
<script type="text/javascript">
var errordialog=function(msg, url, linenumber){
var dialog=document.createElement("div")
dialog.className='errordialog'
dialog.innerHTML=' <b style="color:red">JavaScript Error: </b>' + msg
+' at line number ' + linenumber +'. Please inform webmaster.'
document.body.appendChild(dialog)
return true
}
window.onerror=function(msg, url, linenumber){
return errordialog(msg, url, linenumber)
}
</script>
<body>
<script type="text/javascript">
document.write('hi there'
</script>
</body>
</html>
Click here to
for an actual demo of this simple custom error dialog.
If you're more ambitious, you can actually create a custom
error box that, when closed, sends the information regarding the errors
(error message, line number etc) to you, providing you with an easy way to
debug your scripts with the help of your surfers. The idea is to store all
the error information into an array, and connect the form button inside the
error window to your usual form submission script, so all the error info is
submitted to you when the error box is closed.
|
