JQuery pagecontainer изменение на одной странице блокировки вверх

Я использую Cordova 6.1.1, JQuery 2.1.4 и JQueryMobile 1.4.5. Если я уже на main.html и сменил страницы на main.html, страница блокируется, и ничто не становится кликабельным. Может кто-нибудь сказать мне, почему это так? Я использую код ниже для изменения страниц.JQuery pagecontainer изменение на одной странице блокировки вверх

HTML

<!DOCTYPE html> 
<html> 
    <head> 
     <title>My App</title> 
     <meta name="description" content="My App" /> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 
     <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"> 
    </head> 

    <body> 
     <div id="mainPage" data-role="page"> 
      <div data-role="header" data-theme="c"> 
       <button id="logout" data-role="button" data-inline="true" data-mini="true">Logout</button>    
       <h1>Header 1</h1> 
      </div><!-- /header --> 
      <div role="main" class="ui-content"> 
       <div id="current"></div>     
       <button id="button1" class="ui-btn ui-btn-b ui-corner-all top-margin-1-5">Button 1</button> 
       <button id="button2" class="ui-btn ui-btn-b ui-corner-all top-margin-1-5">Button 2</button> 
       <button id="button3" class="ui-btn ui-btn-b ui-corner-all top-margin-1-5">Button 3</button> 
      </div><!-- /content --> 
     </div><!-- /page -->  
    </body> 
</html>

Javascript

$(document).on("pagebeforeshow", "#mainPage", function() { 
    var $mainPage = $("#mainPage"); 
    var $button1 = $("#button1", $mainPage);   
    var $button2 = $("#button2", $mainPage); 
    var $button3 = $("#button3", $mainPage); 
    var $logout = $("#logout", $mainPage); 

    $logout.off("click").on("click", function(e) { 
     e.preventDefault(); 
     // do something 
    }); 

    $button1.off("click").on("click", function(e) { 
     e.preventDefault(); 
     $("body").pagecontainer("change", "main.html", {reload: true}); // locks up page    
    }); 

    $button2.off("click").on("click", function(e) { 
     e.preventDefault(); 
     $("body").pagecontainer("change", "main.html", {allowSamePageTransition: true}); // doesn't lock up page 
    }); 

    $button3.off("click").on("click", function(e) { 
     e.preventDefault(); 
     // do something 
    }); 
});

CSS

h1,h2,h3,h4,h5 { 
    color:#0071bc; 
} 
/* Change border radius of icon buttons */ 
.ui-btn-icon-notext.ui-corner-all { 
    -webkit-border-radius: .3125em; 
    border-radius: .3125em; 
} 
/* Change color of JQuery Mobile page headers */ 
.ui-title { 
    color:#fff; 
} 
/* Center-aligned text */ 
.text-center { 
    text-align:center; 
} 
/* Top margin for some elements */ 
.top-margin-1-5 { 
    margin-top:1.5em; 
} 
h2.text-danger, 
h3.text-danger { 
    color:red; 
}

источник

2016-04-06 Kal

Код, который вы опубликовали, должен работать. Я сделал мини-демонстрацию изменений pagecontainer [здесь] (https://www.elitesystemer.no/demo/test/36459671/index.html), которые могут быть полезны. В противном случае вам нужно будет отправить больше кода. –

Устанавливает ли allowSamePageTransition: истинная помощь? – ezanker

Использование allowSamePageTransition действительно помогло. Он загрузил страницу, не закрывая ее, однако, когда я вернулся к использованию перезагрузки, она заблокировала ее. Также стоит отметить, что использование перезагрузки не блокирует его на каждой странице. Я вложу больше исходного кода в надежде, что кто-то поможет мне понять, что не так. – Kal

я завелся меняется все перезарядку призывает быть allowSamePageTransition вместо этого.

источник

2016-04-18 13:24:28 Kal

JQuery pagecontainer изменение на одной странице блокировки вверх

ответ

Смежные вопросы