解决方法
我们有一个生产jQM网站,这是我们做事的方式 – 是的,其他人可能不同意,但我们发现这适用于一个非常大的网站.
>使用多个单个HTML页面,大型多页面模板会破坏jQM的ajax加载的好处,因为您在开始时加载了所有HTML(除非您的网站很小)
>你肯定想使用ajax加载,jQM只会提取你的< div data-role =“page”>中的代码.但这会让你的JS复杂化,见下文
>您不需要多个JS文件,但是您确实需要在开始时加载所有JS,我们通过做两件事来实现这一点:1.我们在文档根目录上放置一个监听器,并监听pageinit / pageshow事件.每次加载页面时都会触发这些页面,您还可以方便地引用当前页面,并且可以使用页面上的attr来确定它是什么页面. 2.将所有JS包含在某种类型的包含中(希望您使用的是PHP,CF或其他东西)并将其放在每个页面上,这样无论用户浏览到您的移动站点的哪个入口点,它们都会得到所有代码已加载
缺点是所有的JS都是最初加载的,但是缩小了我们发现它没什么大不了的,如果真的是关注RequireJS的问题 – 加上调试变得轻而易举,因为JS就在那里,我们可以很容易地使用调试器和放置断点.如果你在每个页面上动态加载JS,你会增加每个页面转换时需要返回的数据,而且你很丑陋,因为你重新加载冗余的JS并且很难调试动态JS.
$(document).on('pageinit pageshow','div:jqmData(role="page"),div:jqmData(role="dialog")',function(oEvent){ var pageType = $(this).data('pagetype'); //handle pageinit/pageshow (oEvent.type) for each pageType