如果特定的 jQuery 移动页面发生更改,我想捕捉该事件。例如,我使用了我在下面指出的代码:
$(document).on("pagechange", function () {
alert("page changed");
});
但是,我怎样才能让这个函数只对特定页面运行,例如:具有 id="myPage" 的页面?我想让它仅在 myPage 更改时发出警报。
(* 我在 jquery mobile 中使用多页面结构)
如果特定的 jQuery 移动页面发生更改,我想捕捉该事件。例如,我使用了我在下面指出的代码:
$(document).on("pagechange", function () {
alert("page changed");
});
但是,我怎样才能让这个函数只对特定页面运行,例如:具有 id="myPage" 的页面?我想让它仅在 myPage 更改时发出警报。
(* 我在 jquery mobile 中使用多页面结构)
我认为您可以在页面而不是文档上注册事件:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<div data-role="page" id="pageone">
<div data-role="main" class="ui-content">
<p>Page 1</p>
<div data-role="navbar">
<ul>
<li><a href="#pagetwo" >TWO</a></li>
<li><a href="#" class="ui-btn-active ui-state-persist">ONE</a></li>
</ul>
</div>
</div>
</div>
<div data-role="page" id="pagetwo">
<div data-role="main" class="ui-content">
<p>Page 2</p>
<div data-role="navbar">
<ul>
<li><a href="#" class="ui-btn-active ui-state-persist">TWO</a></li>
<li><a href="#pageone" >ONE</a></li>
</ul>
</div>
</div>
</div>
<script>
$("#pageone").on("pageshow", function() {
alert("cambio a pagina 1");
});
$("#pagetwo").on("pageshow", function() {
alert("cambio a pagina 2");
});
</script>
</body>
</html>
如果您更喜欢 pagechange 事件,您可以获取页面 URL:
$(document).on("pagechange", function(toPage) {
alert(toPage.currentTarget.URL);
});
$(document).on('pagechange', '#myPage', function (event) {
alert("I alert only on #myPage");
});