web-dev-qa-db-ja.com

jquery-mobile / phonegapの$(document).ready()/ onDeviceReady()にスクリプトをロードする方法

PhoneGapとjQuery Mobileを使用してアプリケーションを開発しています。

ページが読み込まれたら、script(.js file)を読み込みます。基本的にonDeviceReadyまたは$(document).ready()。どうやってするか?

22
Coder_sLaY
//wait for document.ready to fire
$(function () {

    //then load the JavaScript file
    $.getScript('script.js');
});

http://api.jquery.com/jquery.getscript

//create a callback function
function myCallback () {


    //create a script element and set it's type and async attributes
    var script = document.createElement('script'); script.type = 'text/javascript'; script.async = true;

    //set the source of the script element
    script.src = 'script.js';


    //add the script element to the DOM
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(script, s);

}

//add event listener for the deviceready function to run our callback function
document.addEventListener("deviceready", myCallback, false);

http://docs.phonegap.com/en/1.4.1/phonegap_events_events.md.html#deviceready

この2番目のコードスニペットは、Googleアナリティクスコードを少し変更したバージョンで、スクリプトをDOMに非同期で追加するために使用されます。

[〜#〜]更新[〜#〜]

<script>タグのdefer属性をtrueに設定することもでき、DOMが準備されるまで実行されません。ここにいくつかのドキュメントを参照してください: https://developer.mozilla.org/en-US/docs/HTML/Element/Script

47
Jasper