在 jQuery Mobile 中执行 $(document).ready 的正确方法是什么？

Question

假设我想在 jQuery Mobile 完成 UI 渲染后运行一些代码。 mobileinit 事件不起作用，因为它是在发生这种情况之前引发的。快速的 Google 搜索似乎表明，仅使用 $(document).ready 不适用于 JQM；但我只是尝试了它（在 mobileinit 之后调用）并且它对我有用：我的代码运行并动态更新元素等，一切都很好。所以我想知道，是否有某种原因我不应该使用它（它不可靠或搞乱了 JQM），或者是关于它不起作用的信息根本不准确？我缺少什么？

更新：请参阅此处进行演示。

Answer 1

您读到 $(document).ready 不适用于 jQuery Mobile 的原因很可能是它不会在您每次查看伪页面时触发。也就是说，当加载 html 文档时它仍然会触发。

如果您想运行每次查看伪页面时触发的代码，可以使用以下代码：

$('[data-role="page"]').live('pageshow', function () {
    //run your code here
});

注意：您还可以绑定其他挂钩（pageshow、pagehide、pagebefoershow、pagebeforehide），可以在此处找到文档:<一href="http://jquerymobile.com/demos/1.0b1/docs/api/events.html">http://jquerymobile.com/demos/1.0b1/docs/api/events.html

< strong>---------- 编辑 ----------

我正在考虑这个，$(document).ready() 的最佳模拟不绑定到“pageshow”事件，它将绑定到“pagecreate”事件。 $(document).ready() 每次页面加载时触发一次，“pagecreate”对伪页面执行相同的操作，而“pageshow”在每次显示页面时触发。

因此，如果用户单击离开主屏幕，然后单击后退按钮返回主屏幕，则“pageshow”将在主屏幕的第二次（以及后续）“显示”时触发。

此外，“pageshow”要求用户导航到它所绑定的页面。