CODEWITHSUNDEEP
javascripthtmljquery
qadenza
qadenza

Reputation: 9293

mimic a click on a download link using another click

adown is a link to a file to be downloaded
it works on my page
btndown is a button to mimic adown click
but simply - doesn't work - nothing happens on btndown click
any help

$('#btndown').on('click', function(){
        $('#adown').click();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a id='adown' href='test.html' download>down</a>
<button id='btndown'>CLICK</button>

Upvotes: 1

Views: 84

Answers (1)

Rory McCrossan
Rory McCrossan

Reputation: 337560

To trigger the click on the a element in order for it to initiate the download you need to fire the event on the Element object, not the jQuery object:

$('#btndown').on('click', function() {
  $('#adown')[0].click();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a id="adown" href="test.html" download>down</a>
<button id="btndown">CLICK</button>

Note that I would suggest not using this pattern though, as it's very easily broken by both users disabling JS and by browser updates. I would suggest changing the button to a duplicate <a download> element, styled as necessary if that is the reason behind changing the element type.

Upvotes: 1

Related Questions