jquery - 使用 pagecontainer 导航到外部页面时未触发事件

Question

Html 1:首页

<script src="js/jquery-1.9.1.min.js"></script>
<script>
        $(document).bind("mobileinit", function(){
            $.mobile.defaultPageTransition = "slide";
            $.mobile.linkBindingEnabled =true;
            $.mobile.ajaxEnabled= false;
        });            
</script>
<script src="js/jquery-mobile.1.4.2.min.js"></script>
<script>
  $(document).on("pagecreate",function(){
    $(".anchor").click(function(){
       $( ":mobile-pagecontainer" ).pagecontainer( "change", "second.html" , { transition:"pop"});
     });       
 });
</script>

Html 2:第二页

<script src="js/jquery-1.9.1.min.js"></script>
<script>
        $(document).bind("mobileinit", function(){
            $.mobile.defaultPageTransition = "slide";
            $.mobile.linkBindingEnabled =true;
            $.mobile.ajaxEnabled= false;
        });            
</script>
<script src="js/jquery-mobile.1.4.2.min.js"></script>
<script>
  $(document).on("pagecreate",function(){

    alert("Instead of alert im going to use ajax ");
 });

问题:

我尝试使用 pagecontainer 将页面从第一页更改为第二页，并且工作正常。 问题是
我需要使用 ajax 和 pagecreate 在第二页中加载一些内容，pageshow 在更改页面时什么都不起作用，但如果我单独运行第二页，它就可以工作...... 提前致谢

Answer 1

为了能够解决这个问题，您需要了解 jQuery Mobile 页面处理的工作原理，但您无法解决这个问题。

当 jQuery Mobile 处理页面时，仅首先将 HTML 文件完全加载到 DOM 中，所有中间文件仅部分加载。当我说部分时，我的意思是 HEAD 将被剥离，并且仅加载第一个 data-role="page" 。

因此，如果您有 2 个页面，例如，假设第一个页面名为 ma​​in.html，第二个页面名为 second.html，并且 lats 表示这两个页面hava 5 data-role="page" div 容器。

ma​​in.html 内的所有页面都将在应用初始化期间加载到 DOM 中，但是当您将页面更改为 second.html 时，仅第一个 data- role="page" div 容器将被加载到 DOM 中，其他所有内容都将被丢弃。

了解更多信息 here + 解决方案。