Jquery mobile：pageinit事件未被触发 [英] Jquery mobile: pageinit event not fired
问题描述
有人可以帮我解决这个问题吗？这可能是一个愚蠢的修复，但我已经被困在这几个小时！
pageinit事件不会触发。获取它的唯一方法是将脚本移入正文，就在结束标记之前，但这个奇怪的结构我没有在任何官方文档中找到，我怀疑是错的！
我在三星手机模拟器（avd）上测试。
Can somebody out there help me out with this code please? This might be something stupid to fix but I've been now stuck with this since hours! pageinit event doesn't fire. The only way to get it fired is to move the script inisde the body, just before the closing tag, but this weird structure I haven't found in any official documentation, and I suspect is wrong ! I am testing on Samsung phone emulator (avd).
<!DOCTYPE html>
<html>
<head>
<meta name="generator"
content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-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>
$( document ).delegate("#aboutPage", "pageinit", function () {
alert('ok');
alert($('#homePage').text());
});
</script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<title>Test Mobile Application</title>
</head>
<body>
<div data-role="popup" id="popupBasic">
<p>-....</p>
</div>
<!-- Begin Homepage -->
<section id="homePage" data-role="page" data-theme="a">
<header data-role="header" data-position="fixed">
<h1>Header</h1>
</header>
<div class="content" data-role="content">
<p>Homepage</p>
<a onclick="javascript:alert($('#homePage').text());" data-role="button">aaaaa</a>
<p>
<a href="#aboutPage">Go to About Page</a>
</p>
<a href="#popupBasic" data-rel="popup">Open Popup</a>
</div>
<footer data-role="footer" data-position="fixed">
<h1>Footer</h1>
</footer>
</section>
<!-- End Homepage -->
<!-- Begin About Page -->
<section id="aboutPage" data-role="page" data-theme="b">
<header data-role="header" data-position="fixed">
<h1>Header</h1>
</header>
<div class="content" data-role="content">
<p>This is About Page</p>
<p>
<a href="#portfolioPage">Go to Portfolio Page</a>
</p>
</div>
<footer data-role="footer" data-position="fixed">
<h1>Footer</h1>
</footer>
</section>
<!-- End About page -->
<!-- Begin Portfolio Page -->
<section id="portfolioPage" data-role="page" data-theme="a">
<header data-role="header" data-position="fixed" data-theme="d">
<h1>Header</h1>
</header>
<div class="content" data-role="content" data-theme="c">
<p>This is Portfolio Page</p>
<p>
<a href="#homePage">Go back to Homepage</a>
</p>
</div>
<footer data-role="footer" data-position="fixed" data-theme="d">
<h1>Footer</h1>
</footer>
</section>
<!-- End Portfolio page -->
</body>
</html>
推荐答案
你的代码工作正常。当您通过点击 aaaa 按钮或链接获取关于页面时， pageinit（）正在被调用一次转到关于页面。
Your code works just fine. pageinit() is being called exactly once when your About page is being fetched either by clicking on aaaa button or by link Go to About Page.
尽管如此：
首先链接 jquery.mobile 首先使用它
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script>
//Your code as of right now
</script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
应该是
<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>
//Your code goes here
</script>
秒由于你使用的是jquery 1.8.2，你可以考虑切换从委托（）到 on（）
Second Since you're using jquery 1.8.2 you may consider switch from delegate() to on()
$(document).on("pageinit", "#aboutPage", function () {
alert('ok');
alert($('#homePage').text());
});
这篇关于Jquery mobile：pageinit事件未被触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
