android - Phonegap的“onBodyLoad()/ onDeviceReady()”函数与Jquery的“$(document).ready()”之间的关系




mobile cordova (2)

$(document).ready将始终首先触发,因为它在所有DOM元素都已加载时被触发。 此时可能尚未加载图像,javascript函数,css等。

所以PhoneGap让你将onload方法放在body的onLoad方法上,以便在DOM的特定部分准备好时触发它。 准备好DOM之后,您将创建一个事件侦听器,以确保phonegap.js 本身已准备就绪(例如,不仅仅是应用程序UI)。 只有在加载phonegap.js后才能使用它提供的功能。

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

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

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

在PhoneGap文档中:

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

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

通常,一旦HTML文档的DOM加载,您将需要使用document.addEventListener附加事件侦听器。

在jQuery doc中:

虽然JavaScript在呈现页面时提供了用于执行代码的加载事件,但在完全接收到所有资产(如图像)之前,不会触发此事件。 在大多数情况下,只要完全构造DOM层次结构,就可以运行脚本。 传递给.ready()的处理程序保证在DOM准备好后执行,因此这通常是附加所有其他事件处理程序并运行其他jQuery代码的最佳位置。 使用依赖于CSS样式属性值的脚本时,在引用脚本之前引用外部样式表或嵌入样式元素很重要。

如果代码依赖于加载的资源(例如,如果需要图像的维度),则应将代码放在load事件的处理程序中。

我的实验表明,ready()总是早于onDeviceReady(),如何解释这个? 我应该如何使用它们? 我应该在onDeviceReady()中放入ready()以使每个调用都安全吗?

先谢谢你。

问候,克里斯


document.ready事件在加载HTML文档时发生,并且window.onload事件始终在所有内容(图像等)加载完成后始终发生。 如果您希望在渲染过程中“尽早”干预而不等待图像加载,则可以使用document.ready事件。 如果您需要在脚本“做些什么”之前准备好图像(或任何其他“内容”),则需要等到window.onload。

例如,如果您正在实施“幻灯片放映”模式,并且您需要根据图像大小进行计算,则可能需要等到window.onlad。 否则,您可能会遇到一些随机问题,具体取决于图像加载的速度。 您的脚本将与加载图像的线程同时运行。 如果脚本足够长,或者服务器速度够快,如果图像碰巧及时到达,您可能不会注意到问题。 但最安全的做法是允许图像加载。 Document.ready可能是一个不错的事件,可以向用户显示一些“加载...”符号,在window.onload上,您可以完成需要加载资源的任何脚本,然后最后删除“加载...”标志。

例子 :-

// document ready events
$(document).ready(function(){
     alert("document is ready..");
})

// using JQuery
$(function(){
   alert("document is ready..");
})

// window on load event
function myFunction(){
  alert("window is loaded..");
}
window.onload = myFunction;




jquery android mobile cordova