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，请参阅此处的文档：{{3} }

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

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

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

Answer 2

修改

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

所以，转到jquery mobile api我们发现我们需要pagechange或pageload事件。

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

2 个答案:

修改