javascript - Download binary without triggering onbeforeunload - Stack Overflow

admin管理员组

文章数量:1180477

I want to kick off a file download for a user when he clicks a link, but I have an onbeforeunload handler that I don't want to get invoked when the download begins. To downloads, I currently have an <a> with the href set to the file location but clicking it results in onbeforeunload being invoked in Chrome (not in FF, though).

I know I can set a private flag and check that in the onbeforeunload handler, but is there some way to kick off the download using ajax? I still want the user to see the usual dialogs when they download the file (Open/Save etc).

Ideas?

I want to kick off a file download for a user when he clicks a link, but I have an onbeforeunload handler that I don't want to get invoked when the download begins. To downloads, I currently have an <a> with the href set to the file location but clicking it results in onbeforeunload being invoked in Chrome (not in FF, though).

I know I can set a private flag and check that in the onbeforeunload handler, but is there some way to kick off the download using ajax? I still want the user to see the usual dialogs when they download the file (Open/Save etc).

Ideas?

• javascript
• ajax
• download

Share Improve this question Follow asked Mar 16, 2010 at 4:27 psychotikpsychotik 39k3535 gold badges103103 silver badges136136 bronze badges

Add a comment  | 

5 Answers 5

Sorted by: Reset to default 12

The best way to do this is indeed by constructing an iframe and triggering the download from there.

I have tested this in Chrome, IE6+ and Firefox and this approach seems to work in all of them.

Example code:

function DownloadFile(filePath) {
    var downloadIframe = $('<iframe />', 
        {
            id    :    'downloadIframe'        
        }).appendTo('body');
    downloadIframe.attr('src', filePath);
}

This will only work properly for a one off download (as we've hard coded an id), if you are triggering multiple downloads, then I suggest you reuse the iframe by storing it in a more widely accessible variable.

Add the download attribute to the a tag, which seems to prevent onbeforeunload from firing:

<a download href="mysite.com"></a>

From this answer.

I would guess using the target attribute on the link could do the trick.

<a href="http://www.example.com/somefile.zip" target="_blank">download</a>

Will not validate (unless using frameset doctype) but it might work.. It will create a new tab or window and then pop a file download (if the http header says it should), but it might leave the new tabs/windows open, or it might close them after saving...

On the other hand I think having a onbeforeunload handler that you sometimes do not want to trigger sounds suspicious, why do you need that anyway?

I know this answer is really late, but there's a simple solution. Create an iframe dynamically, and set the "src" of it to your download url via JavaScript. This'll kick off the download without triggering the unload event (I think).

The download attribute answer worked well for me, but before I noticed it, I tried this, which also works. Just in case it's useful in some other cases that aren't download links.

var linksThatDisableWarning = $('a'); // all links
linksThatDisableWarning.on('mousedown', () =>
    window.isclicking = true);
linksThatDisableWarning.on('mouseup', () =>
    setTimeout(() => window.isclicking = false, 200))
window.addEventListener('beforeunload', (event) => {
  if (window.isclicking) return;
  event.preventDefault();
  event.returnValue = '';
});

本文标签： javascriptDownload binary without triggering onbeforeunloadStack Overflow