我是 jquery 移动框架的新手。根据我的观察,我无法在文档的第一页上触发 pagebeforeshow 事件
任何人都可以遇到同样的问题吗?请建议我触发事件的步骤或任何其他替代方法
我是 jquery 移动框架的新手。根据我的观察,我无法在文档的第一页上触发 pagebeforeshow 事件
任何人都可以遇到同样的问题吗?请建议我触发事件的步骤或任何其他替代方法
在演示中,您将在pagebeforeshow
触发处理程序时看到警报。
休息代码会说清楚,希望它有所帮助,
代码
$(document).bind('mobileinit', function() {
alert('mobileinit');
});
$(function() {
var selector = ':jqmData(role=page)';
$('body').on('pageinit', selector, function(e, data) {
// initialize page
var $page = $(this);
alert('init ' + $page.attr('id'));
}).on('pagebeforeshow', selector, function(e, data) {
// showpage
var $page = $(this);
alert('show Page before Show Stuff == > ' + $page.attr('id'));
});
$('#page1').on('pageinit', function(e, data) {
// setup handler
var $page = $(this);
$page.find('.colorchanger').click(function() {
var $content = $page.find('.ui-content'),
isBodyC = $content.hasClass('ui-body-c');
$content.toggleClass('ui-body-c', !isBodyC).toggleClass('ui-body-e', isBodyC);
});
});
});
另一种对我来说效果很好并且不需要其他事件处理程序的替代方法,因此我所有的 pageshow 绑定都在一个地方是简单地创建一个虚拟的第一页,它将立即更改为第一个可见的页面:
<div id="start" data-role="page" data-title="App Title"></div>
<div id="realFirstPage" data-role="page">
...
</div>
然后在 document.ready 函数的末尾,只需执行以下操作:
setTimeout(function() {
$.mobile.changePage($("#realFirstPage"), {
transition: 'pop',
changeHash: false
});
}, 100);
这可能是因为 jquery dom 模型第一次没有准备好为第一页触发 page show 事件,所以尝试在 pageinit 事件中包含(绑定 pageshow 事件),它适用于我......
$(document).on("pageinit", "#pageId", function(e){
console.log( ' Inside the pageinit event' );
$(document).on("pageshow", "#pageId", function(e){
// code for page show event
});
// code for pageinit event
});