无需替换 url 即可下载生成文件的 Javascript 方法

Question

当用户从同一表单的文本区域中显示的查询中单击 Download 时，我正在生成一个文本和 sql 文件。我已经编写了以下代码。但问题是，URL 正在被替换，下载后整个页面会自动刷新。因此，将无法继续进行操作。

Javascript 方法

function download() {
      var element = document.createElement('a');
      var filename = document.getElementById("filenameInput").value;
      var text = document.getElementById("runquerytext").value;
      element.setAttribute('href', 'data:text/plain;charset=utf-8,' + text);
      element.setAttribute('download', filename);

      element.style.display = 'none';
      document.body.appendChild(element);

      element.click();

      document.body.removeChild(element);
}

任何关于如何在不重新加载/更改 uri 的情况下下载生成的文件的建议将不胜感激。

Answer 1

如果您希望某人在不刷新页面的情况下下载文件，我建议您使用 iframe。该页面正在重定向，因为“a”标签在单击该页面时会重定向该页面。因此，要解决使用 javascript 或图像标记生成动态 iframe 标记的问题。例如：

    function download() {
     var element = document.createElement('iframe');
     var filename = document.getElementById("filenameInput").value;
     var text = document.getElementById("runquerytext").value;
     element.setAttribute('src', 'data:application/octet-stream;charset=utf-8,' + text);
     element.setAttribute('download', filename);
     element.style.display = 'none';
     document.body.appendChild(element);
    }