使用JQuery doesn't download file点击"download“链接

Question

我有一个href和download属性的链接：

  <a id="lnk" href="data:text/csv;charset=utf-8,1%2C2%2C3" download="my_file.csv">click to download</a>

当我点击它时(比如在Chrome中)，一个csv文件"my_file.csv“就会被下载。

现在，我希望能够以编程方式执行此操作。所以使用JQuery我想做的是：

$('#lnk').click();

或

$('#lnk').trigger("click");

但是文件不会被下载。

下面是代码：http://jsbin.com/yereg/3/edit

我可以从链接中复制链接地址，然后使用window.open：

window.open('data:text/csv;charset=utf-8,1%2C2%2C3');

但是这样我就不能设置文件名了(链接是通过download="my_file.csv"属性来设置的)。如果有一种方法可以设置文件名，则此解决方案很好。

备注:在我的例子中，应该支持Chrome和Firefox。我不关心其他的浏览器。

Answer 1

来自jquery文档：

单击事件仅在以下一系列事件之后触发：

当指针位于元素内部时，将按下鼠标按钮。当指针位于元素内部时，释放鼠标按钮。

您可以通过以下方式调用JavaScript本机事件

$('#lnk').get(0).click();

或更安全：

var lnk = document.getElementById('lnk');
if (lnk) {
    lnk.click();
}

编辑：

出于好奇，我看了一下jQuery源代码是如何做到的。事实证明，它们特别是故意阻止浏览器在链接上的本机点击事件，参见以下摘录自最新jQuery版本(2.1.x)的events.js，特别是注释：

click: {
    [...]

    // For cross-browser consistency, don't fire native .click() on links
    _default: function( event ) {
        return jQuery.nodeName( event.target, "a" );
    }
},

Answer 2

尝试使用$('#lnk')[0].click()

JS：

$('#btn1').on('click', function(){
  $('#lnk')[0].click();
});