Param Veer Param Veer - 1 year ago 96
Javascript Question

run click and double click on a anchor tag

I am trying to perform two actions when a user clicks on a anchor tag. The anchor tag will have a video link. The idea was when a user click once on the anchor tag the url will open in new window and when a user will double click on the tag then it will use the html5 download attribute to initiate the download.

<a class="movie-media-download-link" href="" download=""></a>

jQuery(document).on("click", ".movie-media-download-link", function(e) {
// window.location.href = jQuery(this).attr('href');
jQuery(document).on("dblclick", ".movie-media-download-link", function(e) {

When in use prevent default in click then in double click the download attribute of html5 stops working. Even in i unbind the event then also it does not works.

Answer Source

You'll have to create the doubleclick functionality yourself, and use a delay for the regular click to check if it was actually a double click etc.

jQuery(document).on("click", ".movie-media-download-link", function(e) {

    var self = this, time = 500;

    if ($(this).data('flag')) {
        var a = document.createElement('a');
            a.href = self.href;
   = "";
    } else {
        $(this).data('timer', setTimeout(function() {
            window.location.href = jQuery(self).attr('href');
        }, time));

    $(this).data('flag', true);

    setTimeout(function() {
        $(self).data('flag', false);
    }, time);
<script src=""></script>
<a class="movie-media-download-link" href="" download="">Click once to play, twice to download !</a>

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download