tat*_*lar 5 ajax jquery google-maps-api-3 google-maps-markers jquery-mobile
我正在使用jQueryMobile作为移动应用程序.显然我希望UI能够非常快速地加载,但是应用程序有多个工具,因此我只想在导航到的时候为"页面"加载相关的外部JS库.对于主应用程序(90%的页面),我只想要jQueryMobile核心文件(即来自Google AJAX库和jQueryMobile JS&CSS的最新jquery核心).但是,对于剩余的10%,我需要启用地理位置的Google Maps v3(因此Google Gears外部库)和MarkerClusterer库(我有400个标记,我只想在必要时绘制).
据我了解jQueryMobile是如何工作的(所有这些都是通过内部AJAX请求),您必须在应用程序初始化时加载整个应用程序的所有库.这使得我的应用程序在用户第一次请求移动站点时非常繁重(所有核心文件,以及所有map/gelocation/marker集群文件).我想避免这种情况发生,因为它会吓跑许多潜在用户(特别是只有我的用户的一部分需要地理定位的好处).
我尝试在相关页面的末尾(在页脚div之前)加载Google Maps组件,并尝试将它们放入相关页面的<head>标记中.但是这两个都无法初始化(使用附加到函数的console.log()输出进行检查).
是的,在你问之前,我正在使用"pagecreate"live()函数并且正在寻找正确的div(如果我将与谷歌地图相关的所有内容放入根页头标记中,一切正常就可以了)
我觉得这一定是一个非常常见的问题:使用jQueryMobile选择性加载页面组件.我在网上找不到任何东西 - 大多数jQueryMobile教程都是常见的花园'Hello World!' 多种多样,所以如果你有什么可以提供我的全部耳朵!有选择性加载教程的链接也欢迎!
提前致谢!
所有这些页面都会初始化每个页面上所有必需的库。
是的,这是执行此操作的默认方式,因此无论用户首先调用哪个页面/子页面 - 一切正常。所有库都工作正常并且只加载一次。但你可能知道。
假设您想稍后加载一些库,以便即使用户不需要它们,它们也不会减慢整个应用程序的速度,您应该强制它们仅加载正确的页面。
这可以通过一些不同的方式来实现:
rel="external"
该子页面的所有链接。显然,它会重新加载页面,并使您失去 JQM 缓存页面的一些优势,但及时加载库可能是值得的page
div 内时加载并运行 JS。它无法为您工作的原因可能是该库依赖于一个domready
事件,并且您可能必须为该库触发它。但如果你只是触发事件,它会让所有东西(包括 JQM)处理它。您必须使其仅触发库。为此,您需要:
pagesomething
在处理程序中调用该函数另外:如果您遇到页面问题,请尝试绑定到 apageshow
而不是,pagecreate
看看是否有某些内容需要元素首先可见。
归档时间: |
|
查看次数: |
1883 次 |
最近记录: |