Clever Geek Handbook

Call a click on the added dom element

I am trying to trigger a click on this newly created anchor:

$('.file-status').html("Finished downloading <a class='download' download href='#{fileEntry.toURL()}'>#{name}</a>")
$('.download').click()

But the click event is not being called. Not sure why this is?

I am trying to force download rather than open a link in the browser. How Dropbox does

EDIT

Here is the code, so it's more clear:

fileEntry.createWriter ((fileWriter) ->
    fileWriter.onwriteend = (e) ->
        $('.file-status').html("Finished downloading <a class='download' download href='#{fileEntry.toURL()}'>#{name}</a>")
        $('.download').trigger('click');
    fileWriter.onerror = (e) ->
        console.log "Write failed: " + e.toString()
    fileWriter.write blob

), errorHandler

UPDATE:

So, realizing from the answers below, this is not possible, except when the server sends me data with the Content-disposition: attachment header. But this seems like a very bad solution to me for pure HTML5 JS apps that can be disabled.

So, I found this to handle it super amazing! It works great. Here is the link:

http://updates.html5rocks.com/2011/08/Saving-generated-files-on-the-client-side

Hope this helps someone looking to do the same as I'm sure there are a lot of them!

+3


source to share


6 answers


Try to bind your click event to an anchor tag and fire your click event.



$(".download").bind("click", function (e) {
            var $a = $(this);

                    window.location = $a.attr("href");

            });

 $(".download").click();
+1


source


If I understand you correctly, do you want to simulate a user click? If so, this is how you do it:



$('.file-status').html("Finished downloading <a class='download' download href='#{fileEntry.toURL()}'>#{name}</a>");

// simulate/trigger a click
$('.download').trigger('click');
+1


source


You didn't pass the event to the anchor, try this: http://fiddle.jshell.net/gnumA/

$('.file-status').html("Finished downloading 
                        <a class='download' onclick='alert(123);' href='#'>#{name}</a>")
$('.download').click();

update:

$('.download').click(function () {
    window.location.href = $(this).attr('href');
}).click();
+1


source


Show the user that the download is complete and then redirected to download after 1 second.

$('.file-status').html("Finished downloading <a class='download' download href='#{fileEntry.toURL()}'>#{name}</a>");

setTimeout(function () {
   window.location.href = $('.download').attr('href');  
},1000);
+1


source


Try this pluggin livequery

$('.download').livequery(function(){
    $(this).click();
});
0


source


As this question is tagged with CoffeeScript, this is a valid CoffeeScript answer (although still using jQuery).

itemId = $('.modal__product-info').attr('data-item-id')
$('#size-' + itemId).click()
0


source






More articles:


All Articles