在页面转换后执行javascript_Javascript_Jquery_Html_Jquery Mobile_Jquery Mobile Ajax

在页面转换后执行javascript

javascript jquery html jquery-mobile

在页面转换后执行javascript,javascript,jquery,html,jquery-mobile,jquery-mobile-ajax,Javascript,Jquery,Html,Jquery Mobile,Jquery Mobile Ajax,我正在尝试使用jquery mobile创建一个动态phonegap应用程序，但在使用transition进入页面时，在加载javascript时遇到了一些问题我的索引页如下所示： <body> <div data-role="page" id="homePage"> <div data-role="header" data-theme="c" data-position="fixed"> <h1>My Page<

我正在尝试使用jquery mobile创建一个动态phonegap应用程序，但在使用transition进入页面时，在加载javascript时遇到了一些问题

我的索引页如下所示：

<body>
<div data-role="page" id="homePage">

    <div data-role="header" data-theme="c" data-position="fixed">
        <h1>My Page</h1>
    </div>

    <div data-role="content" id="pageName"> 
        <ul data-role="listview">
            <li><a href="pages/clubpage.html?userid=48">This is a test</a></li>
        </ul>   
    </div>

</div>
</body>

$(document).on('pageshow', '#clubPage',function (){ // GET THE CURRENT CLUBPAGE //

    var clubid = getUrlVars()["clubid"];
    $.getJSON("http://mypage.com/groupmenu.php?callback=?&userid="+userid+"&clubid="+clubid,          
        function(data){
            var content = []
            $.each(data , function(i,val){

                content.push(val.list);

            });

        $("#mathes_list_count").html(content.join(""));
        $('#mathes_list_count').listview('refresh');

    });

});

不知怎的，我没有收到警报？我做错了什么

请提前帮助和感谢：-）

实际上，我正试图转到第2页，该页有一个动态生成的listview，如下所示：

<body>
<div data-role="page" id="homePage">

    <div data-role="header" data-theme="c" data-position="fixed">
        <h1>My Page</h1>
    </div>

    <div data-role="content" id="pageName"> 
        <ul data-role="listview">
            <li><a href="pages/clubpage.html?userid=48">This is a test</a></li>
        </ul>   
    </div>

</div>
</body>

$(document).on('pageshow', '#clubPage',function (){ // GET THE CURRENT CLUBPAGE //

    var clubid = getUrlVars()["clubid"];
    $.getJSON("http://mypage.com/groupmenu.php?callback=?&userid="+userid+"&clubid="+clubid,          
        function(data){
            var content = []
            $.each(data , function(i,val){

                content.push(val.list);

            });

        $("#mathes_list_count").html(content.join(""));
        $('#mathes_list_count').listview('refresh');

    });

});

现在我的问题是。。。我可以在进行转换之前生成此文件吗？

由于委派的页面事件需要两个对象，一个是原始文档，另一个是丢失的相同对象，因此您无法获得任何内容。在您的情况下，它是一个页面id：

$(document).on('pageshow', '#homePage',function (){
    alert("I am here!");
});

但这不是你真正的问题

要了解这种情况，您需要了解jQuery Mobile是如何工作的。它使用ajax加载其他页面

第一页正常加载。它的头部和身体被加载到DOM中，它们在那里等待其他内容。加载第二个页面时，只有其正文内容加载到DOM中

在我的另一个答案中阅读更多关于它的内容，您还将找到解决方案和示例：

编辑：

这里有两种可能的解决方案。您可以在之前的页面上执行getJson，存储其内容，并在事件期间在另一个页面上重建它。看看我的另一个答案：如何在转换之间存储数据，在页面转换之间搜索主题数据/参数操作：

或者，您可以在或事件期间初始化页面转换并加载/生成所有数据。这比在pageshow活动中做更好

在我看来，解决方案1是一个更好的解决方案，因为如果使用pageshow事件，转换不会受到影响，数据也不会神奇地出现。

您什么也得不到，因为委派的页面事件需要两个对象，一个像文档一样的原始对象，另一个是您丢失的相同对象。在您的情况下，它是一个页面id：

$(document).on('pageshow', '#homePage',function (){
    alert("I am here!");
});