jquery - Phonegap的 "onBodyLoad()/onDeviceReady()"函数和jquery的 "$(document).ready()"的关系

Question

我在 Android 中使用 PhoneGap + jQuery Mobile，我对 Phonegap 的“onBodyLoad()/onDeviceReady()”函数和 Jquery 的“$(document).ready()”感到困惑。

在 PhoneGap 文档中:

PhoneGap consists of two code bases: native and JavaScript. While the native code is loading, a custom loading image is displayed. However, JavaScript is only loaded once the DOM loads. This means your web application could, potentially, call a PhoneGap JavaScript function before it is loaded.

The PhoneGap deviceready event fires once PhoneGap has fully loaded. After the device has fired, you can safely make calls to PhoneGap function.

Typically, you will want to attach an event listener with document.addEventListener once the HTML document's DOM has loaded.

在 jQuery 文档中:

While JavaScript provides the load event for executing code when a page is rendered, this event does not get triggered until all assets such as images have been completely received. In most cases, the script can be run as soon as the DOM hierarchy has been fully constructed. The handler passed to .ready() is guaranteed to be executed after the DOM is ready, so this is usually the best place to attach all other event handlers and run other jQuery code. When using scripts that rely on the value of CSS style properties, it's important to reference external stylesheets or embed style elements before referencing the scripts.

In cases where code relies on loaded assets (for example, if the dimensions of an image are required), the code should be placed in a handler for the load event instead.

我的实验表明ready()总是早于onDeviceReady()，如何解释？我应该如何使用它们？我应该将 ready() 放入 onDeviceReady() 以确保每次通话都安全吗？

提前谢谢你。

问候，克里斯

Answer 1

$(document).ready 总是会首先触发，因为它会在所有 DOM 元素都加载后触发。图像、javascript 函数、css 等可能此时尚未加载。

因此，PhoneGap 让您将 onload 方法放在主体的 onLoad 方法上，以便在 DOM 的特定部分准备好时触发它。准备好 DOM 后，您将创建一个事件监听器以确保 phonegap.js itself 已准备好(例如，不仅仅是应用程序 UI)。只有phonegap.js加载完成后才能使用它提供的功能。

所以是的，$(document).ready 将首先触发，但这并不意味着您可以使用 phonegap.js(“api”调用)。您不能将 $(document).ready 放在另一个函数中(据我所知)，因为它是由正在加载的 DOM 触发的。您可以(但不应该)从 $(document).ready 调用您的 onDeviceReady 函数。这样做的问题是，如果设备实际上还没有准备好，则不会进行 api 调用。

所以我会继续使用他们设置的主体 onLoad/onDeviceReady 链。如果这需要更多详细说明，请告诉我。