10

これが私の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 形式のデータを取得しているため、セキュリティは問題にならないと考えています。

4

2 に答える 2

26

HTML5 では、data:URLとdownload属性を組み合わせて使用​​できます。例えば、

<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);
});​

こちらをご覧ください。

残念ながら、download属性は完全にはサポートされておらず、data:URL は順調に進んでいます。

現在、クロスブラウザーのサポートを向上させるために、サーバー側でファイルを動的に作成する必要があります。

于 2013-01-02T12:40:53.357 に答える
6

データ 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>

ただし、ファイル名は設定できません。

于 2013-01-02T12:04:07.373 に答える