Question

我有这个函数接受一个字符串，我希望人们能够下载一个由该字符串组成的文本文件。但是，每当我单击链接时，下载的文件只包含整个HTML页面而不是字符串。

JS：

function downloadFile(names) {
  var text = names.toString();
  $('#downloadlink').href = createFile(text);
}

function createFile(text) {
  var data = new Blob([text], {type: 'text/plain'});

  if (textFile !== null) {
    window.URL.revokeObjectURL(textFile);
  }

  var textFile = window.URL.createObjectURL(data);

  return textFile;
}

HTML：

<a download="colors.txt" href="" id="downloadlink">Download</a>

为什么这样做？我是否错误地构建了Blob？我该如何解决？

Answer 1

这里的问题是，当您使用$('#downloadlink')时，jQuery魔术会掩盖您实际执行的操作。 jQuery包装从$返回jQuery对象，这是一个类似于结构的数组。所以即使一个id选择器（可能）返回一个元素，jQuery仍然会给你一个数组。

因此，您无法$('#stuff').href。你需要像这样使用jQuery＆＃39; attr()：

$('downloadLink').attr('href', createFile(text));

与大多数jQuery函数一样，它将一些操作应用于$返回的数组中的所有元素。

工作JSBin。

Answer 2

在运行时，href属性为空。添加$（document）.ready函数或使用经典方式：

window.addEventListener("load", function()
{
    document.getElementById('downloadlink').href = window.URL.createObjectURL(new Blob(["content"], {type: 'text/plain'}));
});

为什么我的文件blob保存整个网页而不是输入的字符串？

2 个答案: