在jQuery Mobile中，如何正确使用$(document).ready？

Question

假设我想在jQuery Mobile完成UI渲染后运行某些代码。由于mobileinit事件是在此之前引发的，因此它不起作用。快速的谷歌搜索似乎表明，使用$(document).ready在JQM中不起作用；但我刚刚尝试过了（在mobileinit之后调用），它对我有效：我的代码运行良好，并且可以动态更新元素等等。因此，我想知道，是否有某些原因使我不应该使用它（它不可靠或会捣乱JQM），还是关于它不能工作的信息只是不准确的？我错过了什么吗？

更新：请看此处进行演示。

- Dan Tao

---

你有查看过 https://dev59.com/Sm035IYBdhLWcg3wGMHa 吗？ - Emil Condrea

@George：是的，根据那个问题，$(document).ready 不起作用。但奇怪的是，对我来说它却起作用了。所以我想知道它现在是否正常工作，或者在处理JQM时是否有一些奇怪的陷阱需要我知道。 - Dan Tao

Answer 1

很可能你看到 $(document).ready 不适用于 jQuery Mobile 的原因是它不会在每次查看伪页面时都触发。尽管如此，它仍会在HTML文档加载时触发，正如它应该触发的那样。

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

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

注意：你还可以绑定其他钩子（如pageshow、pagehide、pagebefoershow、pagebeforehide），文档请参考这里：http://jquerymobile.com/demos/1.0b1/docs/api/events.html

---------- 编辑 ----------

我想了一下，与 $(document).ready() 最相似的类比不是绑定到“pageshow”事件，而是绑定到“pagecreate”事件。$(document).ready() 在每次页面加载时触发，“pagecreate”在伪页面上也会触发同样的效果，而“pageshow”则在每次显示页面时触发。

因此，如果用户从主屏幕点击离开，然后点击返回按钮返回主屏幕，“pageshow”将在第二次（和随后的）“显示”主屏幕时触发。

另外，“pageshow”需要用户导航到其绑定的页面。

- Jasper

---

啊，我明白了；所以“不起作用”的想法一直都是基于误解的吗？很有趣；我看到这些替代方法，认为它们不太理想，因为它们会在每个伪页面显示之前触发一个事件，而不是只在整个文档（即jQuery移动站点）中触发一次。而后者正是我想要的。 - Dan Tao

@jasper，你正在链接到alpha版本的API事件，最好使用beta版本。 - Phill Pafford