How do I execute some javascript after a file is downloaded?

问题

I have a page with a link to a file. When the link is clicked I use the code below to show a loading message:

$('#TerritoriesToExcelLink').click(function() {
    $('#TerritoriesToExcelLoading').show();
    window.location.href = $(this).attr('href');
});

I'd like to hide the message once the file is downloaded and the save dialog pops up in the browser.

I've tried adding some code that fires on ready() but that seems to just run straight away (presumably since the page is already loaded even if the file isn't) so the loading message never gets displayed.

How can I hide the loading message once the file has been completely downloaded?

回答1:

Have your server send a random cookie that you specify from your client-side code with your download in the HTTP headers. Poll in your Javascript to check for the presence of the cookie. This should tell you when the browser has your file.

回答2:

If you aren't opposed to using flash...

You could create an invisible flash object on the page, then when you click the download link, you could trigger flash to download the file, then handle the flash download complete event and use the ExternalInterface API to raise the event in javascript.

回答3:

This is not possible to do with front end javascript, there is no way for it to retrieve the progress of a download and it doesn't have any events relating to downloads.

I don't think tracking the progress can be done with server side languages either.

来源：https://stackoverflow.com/questions/14954121/how-do-i-execute-some-javascript-after-a-file-is-downloaded