9

スクリプトが実際にドキュメントに追加されるまでコールバックを実行しないようにするにはどうすればよいですか?

function addScript(filepath, callback){
    if (filepath) {
        var fileref = document.createElement('script');
        fileref.setAttribute("type","text/javascript");
        fileref.setAttribute("src", filepath);
        if (typeof fileref!="undefined")
            document.getElementsByTagName("head")[0].appendChild(fileref);
    }
    if (callback) {
        callback();
    }
}
4

4 に答える 4

14

理想的な世界では、タグのonloadプロパティを使用できます。<script />

function addScript(filepath, callback){
    if (filepath) {
        var fileref = document.createElement('script');

        fileref.onload = callback;

        fileref.setAttribute("type","text/javascript");
        fileref.setAttribute("src", filepath);

        if (typeof fileref!="undefined")
            document.getElementsByTagName("head")[0].appendChild(fileref);
    }
}

ただし、これは IE では機能しないため、mega-h4x が必要です。

  function addScript(filepath, callback) {
      if (filepath) {
          var fileref = document.createElement('script');
          var done = false;
          var head = document.getElementsByTagName("head")[0];

          fileref.onload = fileref.onreadystatechange = function () {
              if (!done && (!this.readyState || this.readyState === "loaded" || this.readyState === "complete")) {
                  done = true;

                  callback();

                  // Handle memory leak in IE
                  fileref.onload = fileref.onreadystatechange = null;
                  if (head && fileref.parentNode) {
                      head.removeChild(fileref);
                  }
              }
          };

          fileref.setAttribute("type", "text/javascript");
          fileref.setAttribute("src", filepath);

          head.appendChild(fileref);
      }
  }

FWIW、あなたは常にtrueと評価されるので冗長でした。私の例のように、直接if (typeof fileref != "undefined")行うことができます。head.appendChild(fileref);

于 2013-05-24T21:24:57.030 に答える
2

どうですか：

var myParticularCallback = function () {
    // do something neat ...
}

..... your code  

var fileref = document.createElement('script');
fileref.setAttribute("type","text/javascript");

fileref.onload = myParticularCallback;

if (typeof fileref!="undefined")
    document.getElementsByTagName("head")[0].appendChild(fileref);

 // after all has set, laod the script and wait for onload event:
fileref.setAttribute("src", filepath);
于 2013-05-24T21:25:54.507 に答える
1

この小さなスクリプト / css ローダーが仕事をし ます https://github.com/rgrove/lazyload/

LazyLoad.js('/foo.js', function () {
  alert('foo.js has been loaded');
});
于 2013-05-24T21:21:25.987 に答える
-1

callback()最も簡単な方法は、最後に動的にインクルードされたスクリプトで実行される可視関数を定義することです。

于 2013-05-24T21:20:32.393 に答える