1

変換関数（myjs.jsで定義）が常に実行されるようにするにはどうすればよいですか？myjs.jsが読み込まれる前に呼び出されるため、失敗する可能性があるシナリオはありますか？

<body>
<script type='text/javascript'>
$(function(){
   //call a function within myjs.js
   $("#id").conversion({
           settings : url
    });
});
</script>

/*loading myjs.js asynchronously*/
<script type='text/javascript'>
(function(){
    var a = document.createElement('script');
    a.type = 'text/javascript';
    a.async = true;
    a.src = 'http://mydomain/myjs.js'; 
    var b = document.getElementsByTagName('script')[0];
    b.parentNode.insertBefore(a, b);
})();
</script>

</body>

これは、変換関数が常に呼び出されるようにする正しい方法ですか？

$.ajax({
  url: 'http://mydomain/myjs.js',
  dataType: 'script',
  cache: true, // otherwise will get fresh copy every page load
  success: function() {
    // script loaded, do stuff!
     $("#id").conversion({
               settings : url
        });
  }
}
4

2 に答える 2

0

非同期でロードしているので、コードを実行する前にロードされていることを確認する必要があります（おそらく、script要素のonloadコールバックを使用しますか？）。または、スクリプトを「通常の」方法で含めることもできます。

<script src="myjs.js"></script>
<script>
    $(function () {
        $("#id").conversion({
            settings : url
        });
    });
</script>

編集：すべてのscript要素を終了タグの直前に配置</body>すると、スクリプトが実行される前にページ全体が読み込まれ、「通常の」読み込みに害はありません。また、すべてのスクリプトをページの最後に配置することで、domが既にロードされているため、「domready」でスクリプトを実行する必要がありません。

編集：ウィンドウがロードされた状態でdomreadyを交換できる場合があります（不明です）：

$(window).load(function () {
    $("#id").conversion({
        settings : url
    });
});
于 2012-09-18T03:32:48.790 に答える
0

まず、$(function(){jQueryが読み込まれたことを意味しますが、必ずしも他のスクリプトが読み込まれているとは限りません。したがって、これを持っているだけでは、スクリプトがロードされた後に関数が実行されることは保証されません。したがって、スクリプトがロードされる前に関数を呼び出すことができます。

この問題を解決するには、次のようなものが必要です。

(function() {
    function async_load(){
        var s = document.createElement('script');
        s.type = 'text/javascript';
        s.async = true;
        s.src = 'http://yourdomain.com/script.js';
        var x = document.getElementsByTagName('script')[0];
        x.parentNode.insertBefore(s, x);
    }
    if (window.attachEvent)
        window.attachEvent('onload', async_load);
    else
        window.addEventListener('load', async_load, false);
})();

詳細については、http：//friendlybit.com/js/lazy-loading-asyncronous-javascript/を参照してください。

アイデアを明確にし、例を改善するために編集：

これは、ページがロードされるのを待ってから非同期をロードし、ロードされると、ロードされたファイルの外部関数を呼び出すことができる関数をトリガーするため、機能するはずです。

スクリプトを非同期でロードすることから始めます。

(function(){
    var a = document.createElement('script');
    a.type = 'text/javascript';
    a.async = true;
    a.src = 'http://www.example.com/somefile.js';
    var b = document.getElementsByTagName('script')[0];
    b.parentNode.insertBefore(a, b);
})();

次に、次のようなことを行います。

function my_initialization_function() {
    //call a function within myjs.js
   $("#id").conversion({
           settings : url
    });
}

    if(document.addEventListener) {
        window.addEventListener("load", my_initialization_function(), false );
    }
    else if(window.attachEvent) {
        window.attachEvent("onload", my_initialization_function());
    }

説明： (document.addEventListener)それをサポートするブラウザー（IE以外のすべてのブラウザー）のイベント・リスナーを追加します。(window.attachEvent)代わりにattachEventをサポートするブラウザー（IEブラウザー）の場合

于 2012-09-18T03:50:24.580 に答える