使用jQuery Mobile，onload函数不会在HTML中触发

Question

我有一个index.html文件，其语法如下

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
<a href="occassion.html">
  <img class="frametoicon" src="img/occasion.png" />
</a>
</body>
</html>

然后我有occassion.html页面，其具有body onload功能如下

  <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
<title>Occassion</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script>

    function loaded() {
        alert("hii");
    }
</script>
</head>
<body onLoad="loaded()">
</body>
</html>

但onload函数没有启动....如果我尝试刷新页面（ occassion.html ）然后onload函数被激活...为什么它从index.html导航时不起作用？

如果我删除jQuery文件，那么它按预期工作....我想要添加什么？

这也行不通

 $(document).ready(function () {
        loaded();
    });

编辑

我补充道

 <script>
    $(document).bind("pagechange", function (event, data) {
        console.log(data);
        var toPage = data.toPage[0].id;
        alert(toPage);
        if (toPage == "page2")
            alert("hello");
    });
</script>

并将以下内容放在occassion.html中

<div data-role="page" id="page2">
 hello
 </div>

令我惊讶的是，连警报（你好）都没有开火，但也没有显示你好，并且警报（topage）空无一人。

如何？ 缺少了什么

Answer 1

jQuery Mobile使用AJAX将页面拉入DOM，这就是它在页面之间转换的方式。 当jQuery Mobile执行此操作时，很有可能在window.load事件触发后执行此操作，因此除非您刷新页面（然后window.load将再次触发），否则该事件通常不会触发。 用户可能会在window.load事件触发之前单击链接并加载它，但我不希望这是常态。

解决方法是使用jQuery Mobile的具体事件，在这种情况下，你可能找pageload / pagecreate / pageinit ，查看他们的文档在这里： http://jquerymobile.com/demos/1.2.0/docs/api/events html的

这是一个如何工作的快速示例（此代码将集中放置并包含在每个文档中）：

$(document).on("pageinit", "#occasions", loaded);

请注意， #occasions将是时间页面中的data-role="page"元素。

Answer 2

编辑

实际上，由于你使用jquery mobile，可能你在不同的地方看问题。

因此，将jQuery Mobile的API，我们可以看到，我们还挺需要pagechange或pageload事件。

使用jQuery Mobile，onload函数不会在HTML中触发

问题描述

2 个解决方案

解决方案1
9 已采纳 2013-02-06 17:47:51

解决方案2
3 2013-02-06 17:05:56

编辑

使用jQuery Mobile，onload函数不会在HTML中触发

问题描述

2 个解决方案

解决方案1 9 已采纳 2013-02-06 17:47:51

解决方案2 3 2013-02-06 17:05:56

编辑

解决方案1
9 已采纳 2013-02-06 17:47:51

解决方案2
3 2013-02-06 17:05:56