gpt4 book ai didi

javascript - 页面转换后执行 javascript

转载 作者:行者123 更新时间:2023-11-28 20:30:36 24 4
gpt4 key购买 nike

我正在尝试使用 jquery mobile 创建动态phonegap 应用程序,但在使用转换转到页面时加载 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>

在我的“pages/clubpage,html”上,我在标题中包含了以下内容:

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

我怎么没有收到警报?我做错了什么?

请提前提供帮助和感谢:-)

<--------编辑--------->

我实际上正在尝试转到第 2 页,该页面有一个动态生成的 ListView ,如下所示:

$(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');

});

});

现在我的问题是...我可以在转换之前生成它吗?

最佳答案

您没有得到任何东西,因为委托(delegate)页面事件需要 2 个对象,一个是原始的文档,另一个是您缺少的对象。在您的情况下,它是一个页面 id:

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

但这不是你真正的问题。

要了解这种情况,您需要了解 jQuery Mobile 的工作原理。它使用ajax来加载其他页面。

第一页正常加载。它的 HEAD 和 BODY 被加载到 DOM 中,它们在那里等待其他内容。加载第二个页面时,仅将其 BODY 内容加载到 DOM 中。

在我的其他答案中阅读更多相关信息,您还将找到解决方案和示例: Why I have to put all the script to index.html in jquery mobile

编辑:

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

或者您可以在 pagebeforecreate 期间初始化页面转换并加载/构建所有数据。 pageinit 事件。这比在 pageshow 事件期间执行更好。

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

关于javascript - 页面转换后执行 javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16497369/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com