如何用Javascript下載

  • Post category:javascript
你和其他人看過的次數: 448

這裡的下載，是不透過server端回傳，直接將已顯示在網頁上的資料進行下載。

Javascript下載

<!DOCTYPE html>
<html>

<head>
      <title>
            如何使用JavaScript進行檔案下載
      </title>
</head>

<body>

      <textarea id="text">這裡是文字內容</textarea>
      <br />
      <input type="button" id="btn" value="Download" />
      <script>
            function download(filename, inputwds) {

                  var tmpLink= document.createElement('a');
                  tmpLink.setAttribute('href','data:text/plain;charset=utf-8, ' + encodeURIComponent(inputwds));
                  tmpLink.setAttribute('download', filename);
                  document.body.appendChild(tmpLink);
                  tmpLink.click();
                  //document.body.removeChild(tmpLink);
            }
            document.getElementById("btn")
                  .addEventListener("click", function () {
                        var text = document.getElementById("text").value;
                        var filename = "fordownload.txt";
                        download(filename, text);
                  }, false);
      </script>
</body>

</html>

以上用的是Html 5 的語法 ，在超連結中可以直接指定資料內，所以，不需要再回server端要一次資料，就可以下載。

歡迎分享轉載，請註明出處

蘇娜JavaBlog:如何用Javascript下載