运行单击并双击锚标记

我想在用户单击锚标记时执行两个操作。锚标记将具有视频链接。这个想法是当用户点击一次锚点标签时，URL将在新窗口中打开，当用户双击标签时，它将使用html5下载属性来启动下载。运行单击并双击锚标记

<a class="movie-media-download-link" href="http://example.com/video.mp4" download=""></a> 


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

在使用中防止默认点击然后在双击html5的下载属性停止工作。即使在我解绑的事件，然后也不起作用。

来源

2016-11-16 Param Veer

点击是一次双击，首先发生，并且总是发生。 – adeneo

如果您使用单独的按钮进行这些操作会更好。对于最终用户来说，这也会更直观。 – Vaidas

你说得对。但是有没有办法可以建立这个？ –

你必须自己创建双击功能，并使用延迟常规点击检查它是否实际上是双击等

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

 
    var self = this, time = 500; 
 

 
    if ($(this).data('flag')) { 
 
     clearTimeout($(this).data('timer')); 
 
     var a = document.createElement('a'); 
 
      a.href = self.href; 
 
      a.download = ""; 
 
      a.click(); 
 
    } 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="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a class="movie-media-download-link" href="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" download="">Click once to play, twice to download !</a>

来源

2016-11-16 14:47:52 adeneo

浏览器接受双击的标准时间是500ms，所以它可能是值得改变定时器到500. –

@Antonvb - 好建议，我只设置400ms，因为它似乎是正确的，但Windows使用500毫秒作为默认设置*（它是基于操作系统的）* – adeneo

你好，感谢你的回复，你的代码工作完美，但我希望下载的东西在双击时开始，而不是单击我的问题。那可能吗？ –

我会建议如果你真的希望这两个事件绑定在同一个元素上，使用定时器结构。

例子：

var isDblclick = false; 

$('#element').on('click', function() { 

    setTimeout(function() { 

     if(!isDblclick) { 
     //Run your single click here 
     } 

    }, 500); 

}); 

$('#element').on('dblclick', function() { 

    isDblclick = true; 
    //Run your dbl click functionality here 
    isDblclick = false; 

});

现在的延迟是不是最佳的，所以我建议你实现在信号而你决定要触发这些动作的用户有事情发生在按钮上有微调。

如果你不想延迟，我建议分开不同按钮上的两个事件。

来源

2016-11-16 14:51:08

运行单击并双击锚标记

回答

相关问题