I have a web page with a basic form. There's a non-negligible wait time between clicking "submit" and the page reloading with results, so I added a little spinner while the user waits.

It's pretty straight forward, here is the HTML:

```
<div id="loadingBox" style="display:none;">
    <!---put the actual loader here--->
</div>

```

Here is the basic event handler for making the spinner visible after the user clicks submit:

```
$("#submitButton").submit(function(e)
{
    $("#loadingBox").css('display', 'block');
});

```

The problem is that the user can click submit, make the box appear, and then hit escape or click the browser button to cancel the page load, and the spinner keeps spinning. 

I added this to make the spinner disappear if they hit escape:

```
$(document).keydown(function (e)
{
    if(e.keyCode == 27)
    {
        $("#loadingBox").css('display', 'none');
    }
})

```

What can I do to detect that the user has clicked the cancel page load button? I cannot find an event that fires when that button is clicked and I cannot find a ready state or other attribute that reflects it. My concern is a user clicks the cancel load button, and then the spinner doesn't go away, and the user stares at the spinner thinking the page is still doing something, but it isn't doing anything.