JQuery document.ready vs Phonegap deviceready

Question

我正在用jquery制作一个phonegap应用程序.我很困惑,我是否应该换我整个代码JQuery的内部$(document).ready()像

$(document).ready(function(){
    //mycode
});

或者像phonegap这样的deviceready事件

document.addEventListener("deviceready", function(){
    //mycode
});

我目前正在使用,document.ready但我想如果我尝试访问内部的一些Phonegap API方法,我可能会遇到问题document.ready.

哪个是包含我的代码,document.ready或deviceready的最佳事件？

Answer 1

答案的关键点在于事件文档中的这一行deviceready.

此事件的行为与其他事件的不同之处在于,在事件触发后注册的任何事件处理程序都将立即调用其回调函数.

这意味着如果在事件被触发后添加侦听器,您将不会"错过"该事件.

因此,首先将所有初始化代码移动到onDeviceReady函数.然后先处理document.ready.在document.ready中,如果您确定在浏览器中运行,只需调用onDeviceReady函数,否则添加deviceready listener.这样,当您在onDeviceReady函数中时,您确信已经发生了所有必需的'准备就绪'.

$(document).ready(function() {
    // are we running in native app or in a browser?
    window.isphone = false;
    if(document.URL.indexOf("http://") === -1 
        && document.URL.indexOf("https://") === -1) {
        window.isphone = true;
    }

    if( window.isphone ) {
        document.addEventListener("deviceready", onDeviceReady, false);
    } else {
        onDeviceReady();
    }
});

function onDeviceReady() {
    // do everything here.
}

isphone检查有效,因为在phonegap中,index.html使用file:///url 加载.

Answer 2

您应该使用deviceready事件来避免发生有趣的事情.

文档说明:

这是每个PhoneGap应用程序都应该使用的非常重要的事件.

PhoneGap包含两个代码库:本机和JavaScript.在加载本机代码时,会显示自定义加载图像.但是,只有在DOM加载后才会加载JavaScript.这意味着您的Web应用程序可能会在加载之前调用PhoneGap JavaScript函数.

一旦PhoneGap完全加载,PhoneGap deviceready事件就会触发.设备触发后,您可以安全地拨打PhoneGap功能.

通常,您需要在document.addEventListener加载HTML文档的DOM后附加事件侦听器.

请阅读此处的文档:http://docs.phonegap.com/en/1.0.0/phonegap_events_events.md.html