jquery mobile pagecontainerbeforeshow事件未触发答案

【问题标题】：jquery mobile pagecontainerbeforeshow event not firingjquery mobile pagecontainerbeforeshow事件未触发
【发布时间】：2015-08-19 23:14:51
【问题描述】：

我正在尝试在 Jquery mobile 1.4.5 中注册 pagecontaintershow 事件。在我的页面加载然后更改后，我的 pagecontainerbeforeshow 事件永远不会被捕获或触发。新页面确实加载正确

以下代码等待按钮单击，然后切换到新页面。我在加载之前注册了 pagecontainerbeforeshow 事件。我什至尝试了不同的页面容器侦听器，但仍然一无所获。捕捉事件的正确方法是什么？

更新 1：

我正在阅读有关您可以和不能将 pagecontainer 事件绑定到什么的相互矛盾的信息。我读过只有绑定到“文档”才有效，而我也读过你应该能够绑定到实际的页面 ID。我刚刚测试了与文档的绑定并触发了该事件，但这将在每次页面加载时触发。我必须检查活动页面是什么吗？是否允许绑定到 in id？

更新 2：

所以我做了更多阅读，jqm 1.4 到 1.4.3 只允许您使用“文档”进行绑定。 jqm 1.4.5 应该让你也绑定到页面 id。然而，那是我的问题所在。它不起作用。有什么想法吗？

new_page.html：

<div data-role="page" id="new_page">
    <div data-role="header" >Header</div>
    <div data-role="content" >Hello</div>
    <div data-role="footer" >footer</div>
</div>

JS：

     $(document).on("click", "#button", function  () {

//设置事件监听器（永远不会被触发）

        $("#new_page").one( "pagecontainerbeforeshow", function( event, ui ){
            /// do something
        });

//加载新页面（页面加载正常）

        $($mobile_pagecontainer).pagecontainer( "change", "new_page.html", { role: "page"} );

     });

【问题讨论】：

请检查更新。

标签： jquery-mobile

【解决方案1】：

此时的 jQuery Mobile 文档至少可以说令人困惑，这是基于我自己的研究和测试。

被描述为一个，pagecontainer 本身就是一个 JQM 小部件，因此，它需要像普通页面（最终它本身就是一个小部件）那样需要所有页面增强功能。因此，在调用任何pagecontainer 事件之前，您需要确保在文档本身上触发了pagecreate 事件。这个小提琴说明了这种行为，如果您从文档中删除 pagecreate 事件，您会注意到该事件根本没有被触发，因为与 document.ready JQM 有相同的冲突。

http://jsfiddle.net/juancalpizar/c6eo93Lt/1/

【讨论】：

【解决方案2】：

这可能会迟到，但对我有用的是

$("body").on("pagecontainerbeforeshow", 
    function( event, ui ) {
         if(ui.toPage[0].id === "new_page"){
              // Do stuff
         }
    }
);

如果这也不起作用，请尝试使用相同的代码

"pagecontainerbeforetransition"

【讨论】：

【解决方案3】：

我在我的 JQuery mobile 1.4 应用程序上遇到了同样的问题，页面事件没有触发。

您尝试过以下语法吗？

    $(document).delegate("#pageId", "pagecontainerbeforeshow", function() {
        //do Something
    });

请注意，如果您使用 pagebeforeshow 而不是 pagecontainerbeforeshow 它有时对我有用，但它的使用已被弃用。

如果你能得到它，请让我更新，谢谢。

【讨论】：