Hon*_* Yi 5 javascript jquery jquery-mobile cordova
我有两个页面,我使用swipeleft和swiperight事件(来回)链接,但当我滑到另一页时,jquery不会触发pageinit事件,我只剩下页眉和页脚.我应该使用changePage事件还是应该使用loadPage事件？我知道jquerymobile的另一个版本中有一个错误,其中pageinit事件没有触发,但我已经使用已经解决它的RC1但事件仍然没有触发.什么阻止它开火？提前致谢.
代码如下:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>esports</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
<link rel="stylesheet" href="jquery.zrssfeed.css" />
</script>
<style>
</style>
</head>
<body>
<!-- index -->
<div data-role="page" id="index">
<div data-role="header">
<h1>esports times</h1>
</div>
<!--/header-->
<div data-role="content" id="content">
<div id="currentFeed">teamliquid. skgamin</div>
<ul id="rssFeed" data-role="listview">
</ul>
</div>
</div>
</body>
</html>
<!-- load javscripts here-->
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"> </script>
<script src="jquery.zrssfeed.js"></script>
<script>
$('#index').bind("pageinit", (function () {
$('#rssFeed').rssfeed('http://feeds.reuters.com/reuters/oddlyEnoughNews', {
limit: 10,
date: false,
});
}));
$('#index').bind("swipeleft", function () {
$.mobile.changePage("teamliquid.html", "slide", true, false);
});
</script>
<!-- /javascript-->
更改页面是您正在寻找的.加载页面只是将其加载到dom中,因此您可以在实际显示页面之前进行操作.
绑定到页面init时,请确保使用唯一ID绑定pageinit事件.他们不能都有id ="#index".还要确保将页面init绑定到每个页面.您的代码只会针对#index页面而不是teamliquid.html触发pageinit.
在<head></head>文档中使用以下内容:
$(document).on('pageinit','#index', function(){
$('#rssFeed').rssfeed('http://feeds.reuters.com/reuters/oddlyEnoughNews', {
limit: 10,
date: false,
});
});
$(document).on('pageinit','#otherpage', function(){
... This would be for the other page you are referring to....
});
$(document).on('swipeleft','#index', function(){
$.mobile.changePage("teamliquid.html", { transition: "slide" });
});
$(document).on('swiperight','#otherpage', function(){
$.mobile.changePage("index.html", { transition: "slide" });
});
或者获取每页的火灾信息
$(document).on('pageinit','[data-role=page]', function(){
....ground breaking code...
});
从jquery 1.7开始,bind,live和delegate都使用.on()方法.这是为JQM绑定pageinit的推荐方法.你也可以做一些很酷的事情,比如用'[data-role = page]'替换'#index',以便在每一页上激活你的代码.这是一个JSfiddle,证明这确实有效.http://jsfiddle.net/codaniel/cEWpy/2/
| 归档时间： |
|
| 查看次数： |
9982 次 |
| 最近记录： |