Question

这是我的HTML代码，

<ul>
  <li> Download <a href="#">file1</a> </li>
  <li> Download <a href="#">file2</a> </li>
  <li> Download <a href="#">file3</a> </li>
</ul>

我想创建类似"href=filename.txt"的内容。需要根据点击的标签动态创建文本文件的"filename"及其内容。

我使用Web API获取JSON格式的数据，因此认为安全性不应成为问题。

Answer 1

从 HTML5 开始，您可以使用data: URL和download attribute的组合。例如，

<a href="data:text/plain;charset=UTF-8,Hello%20World!" download="filename.txt">Download</a>

或者，以编程方式，

<a id="programatically" href="#" download="date.txt">Download</a>

$("a#programatically").click(function() {
    var now = new Date().toString();
    this.href = "data:text/plain;charset=UTF-8," + encodeURIComponent(now);
});

See it here.

不幸的是，download attribute is not fully supported和data: URLs are in good track。

现在，为了获得更好的跨浏览器支持，您需要在服务器端动态创建文件。

Answer 2

您可以使用data URI，这是一个非常简单的示例：

<html>
<body>
<a href="#">click</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function() {
    $("a").click(function() {
        window.location.href = "data:text/plain;charset=UTF-8,Hello World";
    });
});
</script>
</body>
</html>

但是，您无法设置文件名。

我可以使用jQuery动态创建文件（及其内容）吗？

2 个答案: