停止显示页面

我想做这样的事情：

$(document).on("pagebeforeshow", "#myPage", function(event){ if(condition){ //I need to do something here to stop loading "myPage" ??? $.mobile.changePage("example.jsp"); } else { //continue showing actual page normally ... } }); 

我没有找到任何方法更改为“example.jsp”页面而没有显示“myPage”一秒钟。 有没有办法做到这一点？ 我尝试使用像window.stop()和event.stopPropagation()这样的东西，但它不起作用。

谢谢！

Answer 1

在您的情况下，您需要侦听pagebeforechange事件以传递显示data.toPage并显示另一个。

使用pagebeforehide和pagebeforeshow将导致显示data.toPage然后跳转到目标页面。

演示

 // for demo purposes var condition = 0; // triggers when leaving any page $(document).on("pagebeforechange", function (e, data) { // id of page that you want to skip if condition is true/false, it's up to you var to_page = data.toPage[0].id; // skip showing #myPage if condition is true if (to_page == "myPage" && condition == 0) { // true! go to p3 instead $.mobile.changePage("#p3", { transition: "flip" }); /* prevent updating URL history and allow new transition if you want. Without this, #myPage will be pushed into $.mobile.urlHistory and any new transition (animation) will be neglected */ e.preventDefault(); } /* in the demo, if you change condition value, #p2 will be shown when condition returns "false". #myPage will be shown normally */ }); 

注意： pagebeforechange会触发两次，这是正常的，不要惊慌;）

Answer 2

经过测试和工作：

HTML

 
 
 
Index page
 
 
 To second page 
 
 
 
 
Second page
 
 
 
 
 
 
 
Third page
 
 
 
  

jQuery的

 $(document).on('pagebeforechange', function(e, data){ var to = data.toPage; var from = data.options.fromPage; if (typeof to === 'string') { var u = $.mobile.path.parseUrl(to); to = u.hash || '#' + u.pathname.substring(1); if (from) from = '#' + from.attr('id'); if (from === '#index' && to === '#second') { e.preventDefault(); e.stopPropagation(); $.mobile.changePage( "#third"); } } }); 

的jsfiddle

http://jsfiddle.net/tronc/GPUay/3/

Answer 3

我认为最好的方法是默认隐藏页面，只有在通过条件时才显示它。 所以它看起来像这样

CSS：

 #myPage { display: none; } 

JS：

 $(document).on("pagebeforeshow", "#myPage", function(){ if(condition){ $.mobile.changePage("example.jsp"); } else { $('#myPage').show() } }); 

Answer 4

我知道如果我使用“pagebeforechange”事件它工作正常，但我需要在加载其他页面时（但未显示）。 我找到了一个解决方案，添加一个新的DIV元素作为页面DIV子，隐藏并显示它：

HTML

 
 
 ... 
  

JS

 $(document).on("pagebeforeshow", "#myPage", function(){ $("#contentTarget1").hide(); if(condition){ $.mobile.changePage("#target2Page"); } else { $('#contentTarget1').show(); ... } });