无法从jQuery Deferred处理程序中跟随HTML5下载链接

Question

我想做什么

我正在开发一个Web应用程序。 （超级精彩，我知道！）点击特定按钮时，应该为用户提供一个可供下载的文件。该文件的内容是在异步操作中即时生成的。

我现在是怎么做的

我的页面的HTML包含“下载”按钮的标记，看起来像这样（注意缺少href属性是有意的）：

<a id="download-button" download="data.txt">Download</a>

根据this resource，在HTML5中download属性

  

表示它指向的资源应该由浏览器下载而不是导航到它。

“下载”按钮有一个与之关联的jQuery点击处理程序，如下所示：

$('#download-button').on('click', function(e) {
  var button = $(e.currentTarget);
  if (!button.attr('href')) {
    foo.frob().then(function(content) {
      var blob = new Blob(content, { type : 'text/plain' });
      var url = (window.URL || window.webkitURL).createObjectURL(blob);
      button.attr('href', url);
      button.click();
    });
  } else {
    return true;
  }
});

...其中foo是Backbone.Collection对象，frob是一个返回可下载内容的jQuery承诺的方法。第一次单击按钮时会创建“下载”按钮的缺少href属性的值，然后将该属性添加到相应的HTML元素中。当第二次单击该按钮时，我指示浏览器只是按照链接（由于存在download属性，应该导致浏览器提示用户他们是否愿意下载生成的内容。）

问题

目前，浏览器拒绝关注该链接。 触发按钮上的click事件有效，因为我可以在alert console.log之前成功return true或else发送消息部分代码。

其他意见

如果我删除异步计算，而是使用一些任意数据填充Blob，问题就会消失。

另外，如果我替换

button.attr('href', url);
button.click();

与

window.location = url;

浏览器将关注该链接，但不会提供下载文件，而是会在新页面上显示内容。

Answer 1

jQuery .click()函数只触发点击处理程序。原生click()方法会导致遵循链接：

button[0].click()