web-dev-qa-db-ja.com

JSzipを使用する場合、saveAsは定義されていません

簡単なjszipを実行しようとするとエラーが発生します

キャッチされていない（約束）ReferenceError：saveAsが定義されていません

正しいファイルをすべて含めたので、何が間違っているのかわかりません。誰かに教えてもらえますか？

    <!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Download</title>
    <link rel="stylesheet" href="css/download.css">
    <script type="text/javascript" src="jszip/dist/jszip.js"></script>
    <script type="text/javascript" src="https://stuk.github.io/jszip-utils/dist/jszip-utils.js"></script>
    <script src='https://code.jquery.com/jquery-2.2.4.min.js'></script>
    <script src="js/download.js"></script>
    <link href="https://fonts.googleapis.com/css?family=Josefin+Sans" rel="stylesheet">
  </head>

  <body>
  <div class="maindiv"> 
    <header>
      <a href="index.html" class="company">Instasample</a>
      <a href="login" class="login">Login</a>
    </header>
    <div class="soulection">
    <button id="kick" onclick="download(this.id)" >kick</button>
    <button id="snare" onclick="download(this.id)" >snare</button>
    <button id="hat" onclick="download(this.id)" >hat</button>
    <button id="open hat" onclick="download(this.id)" >open hat</button>
    <button id="rim" onclick="download(this.id)" >rim</button>
    <button id="perc" onclick="download(this.id)" >perc</button>
    <button id="tom" onclick="download(this.id)" >tom</button> 
    <button id="clap" onclick="download(this.id)" >clap</button>
    <button id="foley" onclick="download(this.id)" >foley</button>
    <button id="ambient" onclick="download(this.id)" >ambient</button>
    <button id="effects" onclick="download(this.id)" >effects</button>
    <button id="vocal" onclick="download(this.id)" >vocal</button>
    <button id="synth" onclick="download(this.id)" >synth</button>
    <button id="808" onclick="download(this.id)" >808</button>
    <button id="bass" onclick="download(this.id)" >bass</button>
    <button id="sample" onclick="download(this.id)" >sample</button>
    </div>
    </div>
  </body>
  <script type="text/javascript">
    (function () {
  var Zip = new JSZip();
  Zip.file("Hello.txt", "Hello world\n");

  function bindEvent(el, eventName, eventHandler) {
    if (el.addEventListener){
      // standard way
      el.addEventListener(eventName, eventHandler, false);
    } else if (el.attachEvent){
      // old IE
      el.attachEvent('on'+eventName, eventHandler);
    }
  }

  // Blob
  var blobLink = document.getElementById('kick');
  if (JSZip.support.blob) {
    function downloadWithBlob() {
      Zip.generateAsync({type:"blob"}).then(function (blob) {
        saveAs(blob, "hello.Zip");
      }, function (err) {
          blobLink.innerHTML += " " + err;
      });
      return false;
    }
    bindEvent(blobLink, 'click', downloadWithBlob);
  } else {
    blobLink.innerHTML += " (not supported on this browser)";
  }

})();
  </script>
<footer>
  <a href="mailto:[email protected]?Subject=Hey%20Instasample" class="bottom">contact</a>
  <t class="bottomline">&nbsp;|&nbsp;</t>
  <a href="https://www.Paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=5LC9QK23C9M28" class="bottom2">donate</a>
  <t class="bottomline">&nbsp;|&nbsp;</t>
  <t class="bottom3">&copy 2016</t>
</footer>

</html>
javascripthtmljszip
12
Nick Garver

例にはコメントがあります。

_// see FileSaver.js
_

saveAs()を使用する場合は、そのモジュールが必要です

ここにあります： https://github.com/eligrey/FileSaver.js

21
zord

次のスクリプトタグをHTMLに追加すると機能します

<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.js"></script>

1
KuboAndTwoStrings