Navigate with location.href during XMLHttpRequest asynchronous call

I have a web page containing something like this:

<div onclick="location.href = 'AnotherPage';">

This page also uses asynchronous XMLHttpRequests for some ajax updating.

I have found that while an asynchronous XMLHttpRequest is in progress, clicking on this div does not load the new page. If I cancel my request first then it works fine. This seems wrong, but I cannot find any documentation that describes what should happen.

So the question is: what should happen to asynchronous XMLHttpRequests in progress when a new page is loaded using location.href?

edit - I worked around this problem by handling window.onbeforeunload and aborting my pending async request there. The question remains though, whether I should need to do this?

You might check out a similar question:

Browser waits for ajax call to complete even after abort has been called (jQuery)

I also saw a few questions where browser history issues were arising in similar circumstances, and the workaround was to wrap the location change in a setTimeout() call with 0 delay. If that were to fix the behavior, I'd be baffled as to the reasoning, but it'd be interesting to see the effect nevertheless.