javascript - Trigger click on link with 'download' attribute - Stack Overflow

admin管理员组

文章数量:1332389

I have some links like this:

<a class="download-link" href="/some/file.mp3" download="file.mp3">download></a>

When this link is clicked, the file is downloaded with no prompt.

I'm trying to make a "download all" button, but I'm failing because it's seemingly not possible to trigger on a click on these links.

For example:

$($("a[download]")[0]).trigger("click")
// this shows no error, but the file is not actually downloaded

According to this article from 2013, it is possible to trigger clicks on download links in Chrome. Has this been deprecated? Is there an alternative approach?

By the way I'm using Chrome 52. Ideally I'd find something that works on Chrome for Android as well.

My suspicion is that it is not possible, because then websites could download all sorts of malicious files if they want to. However since a 'download all' button is a mon use case, I'm wondering if there is some working approach. I don't need to trigger the initial click - the "download all" button will be clicked by the user, and this will trigger the subsequent clicks.

---

To try it your self, go to / and type the following script in the console: $($("a[download]")[0]).trigger("click")

I have some links like this:

<a class="download-link" href="/some/file.mp3" download="file.mp3">download></a>

When this link is clicked, the file is downloaded with no prompt.

I'm trying to make a "download all" button, but I'm failing because it's seemingly not possible to trigger on a click on these links.

For example:

$($("a[download]")[0]).trigger("click")
// this shows no error, but the file is not actually downloaded

According to this article from 2013, it is possible to trigger clicks on download links in Chrome. Has this been deprecated? Is there an alternative approach?

By the way I'm using Chrome 52. Ideally I'd find something that works on Chrome for Android as well.

My suspicion is that it is not possible, because then websites could download all sorts of malicious files if they want to. However since a 'download all' button is a mon use case, I'm wondering if there is some working approach. I don't need to trigger the initial click - the "download all" button will be clicked by the user, and this will trigger the subsequent clicks.

---

To try it your self, go to https://maxpleaner.github.io/my_music/ and type the following script in the console: $($("a[download]")[0]).trigger("click")

• javascript
• jquery
• html
• google-chrome

Share Follow edited Aug 12, 2016 at 22:48 max pleaner asked Aug 12, 2016 at 22:33 max pleanermax pleaner 26.8k99 gold badges7171 silver badges128128 bronze badges 10

• If the does not work, you could consider using a window.open and making sure the server is sending a mime type for the file to force a download. – j_mcnally Commented Aug 12, 2016 at 22:42
• @j_mcnally I'm using a static server - github pages. Not sure how I'd set the mime type in this situation. Using rawgit I get this url for one of my mp3s, but it plays the song instead of downloading it. – max pleaner Commented Aug 12, 2016 at 22:45
• 1 actually your code fails with this error: Cannot read property 'trigger' of null(…); Your backend is written in php? – Caius Commented Aug 12, 2016 at 22:45
• 1 ok, my bad. I see that you're using the 3.x. I've tried to add an ID to a element and then use vanilla js to trigger the click. If you can edit the DOM with the loop adding an incremental id to each 'downloadable' link, then you can loop all the links and trigger the .click() – Caius Commented Aug 12, 2016 at 22:57
• 1 @Caius thank you - using vanilla js was the suggestion made in rvighne's answer too. – max pleaner Commented Aug 12, 2016 at 22:59

 |  Show 5 more ments

2 Answers 2

Sorted by: Reset to default 8

I am not sure how jQuery does it, but the following vanilla JavaScript successfully downloads every link on the page:

for (let link of document.querySelectorAll('a[download]'))
    link.click();

Chrome then prompts me if I want to download multiple files, and it works.

Though you may want to warn users before doing this, as it makes the browser somewhat sluggish.

You have missed a dot for the CLASS in ".download-link"

$($(".download-link")[0]).trigger("click")

本文标签： javascriptTrigger click on link with 39download39 attributeStack Overflow