jQuery document.ready 不会被 Android 的第二个屏幕触发

Posted 2023-05-09

【中文标题】jQuery document.ready 不会被 Android 的第二个屏幕触发

【英文标题】：jQuery docment.ready not getting fired from second screen in Android

【发布时间】：2016-06-02 16:38:07

【问题描述】：

jQuery docment.ready 没有从第二个屏幕被触发，而它在第一个/初始屏幕被触发。

jQuery Mobile 也包含在 html 中，jQuery Mobile 是否阻塞了 document.ready，我在某处看到我们必须使用 jQuery Mobile 的“pageinit”而不是“document.ready”。但这个应用程序是为所有平台——桌面、平板电脑和移动而开发的。

那么在这种情况下，合适的解决方案是什么？在所有页面上从 document.ready 更改为 pageinit 很乏味。

【问题讨论】：

什么是“第二屏”？

JQM 是一个框架，因此要使事情正常进行，您需要遵守该框架的规则。不要走捷径，因为你觉得它们很乏味

***.com/a/23302340/1771795

【参考方案1】：

jquery-mobile 没有阻止 $( document ).ready( )

当 DOM 完全加载时触发 ready 事件。Jquery API Doc of .ready()

jquery-mobile 的最大优势之一是 ajax 导航。如果单击链接，jqm 不会再次加载整个页面。不！它仅加载具有 role="page" 的 div 并将其添加到 DOM。 当 DOM 不再加载时，您将不会收到第二个 ready 事件。

要控制您的应用程序，您必须利用来自 jquery-mobile 的事件。您可以准确地检测到显示的页面，您可以检测到页面何时（通过 AJAX）加载到 DOM 中。

---

jquery-mobile 中有很多有趣的事件。 pageshow 和 pagecreate（不是 pageinit，因为 pageinit 在 1.4.0 中已弃用，取而代之的是 pagecreate） 我包括了一些基本的例子。但是还有更多的事件和方法来倾听它们。

jquery-mobile Pagecontainer API jquery-mobile Events API

页面创建

pagecreate（文档，一个） 这将在创建页面后执行。请注意，我使用的是一个而不是打开。 如果您使用 on 而不是 one，则在创建和增强页面时，将为每个页面触发此事件。

$( document ).one( "pagecreate", function( event )  

);

pagecreate（特定页面） 这将在创建 id 为 page1 的页面时触发。

$("#page1" ).on( "pagecreate", function( event ) 

);  

页面展示

页面显示（文档） 这将在每次显示页面时触发。

$(document).on("pageshow", function( event ) 

);

pageshow（特定页面） 每次显示 id 为 page1 的页面时都会触发此操作。

$("#page1" ).on("pageshow", function( event ) 

);

【讨论】：

是的，我知道 dom ready 没有被触发，因为 DOM 没有再次加载，我提到了 pageinit，因为 jQuery Mobile 版本较低，现在也无法升级。正如我所提到的，在所有页面中更改或添加 pageinit 或 pagecreate 或其他事件是一项繁琐的工作。寻找更简单的解决方案。