Jquery Mobile - Detectar actualización de página - Volver a la página de inicio

Question

¿Es posible detectar una actualización de página dentro de una página HTML5 móvil Jquery?

Estoy compilando un cuestionario como parte de un proyecto de cliente: el cuestionario navega a través de las páginas de jquery mobile div dentro de la página de un html ... así que por ejemplo si el usuario estaba en index.html # quizpage3 y actualizado me gustaría detectar la actualización y devolver la navegación a index.html.

¿Esto es posible?

Saludos Paul

Answer 1

Esta es la solución que yo estoy trabajando. Al momento de escribir, parece funcionar bien, así que podría ayudar a alguien. Sin embargo, es solo una solución rápida y para una mejor funcionalidad es mejor hacerlo desde el lado del servidor.

Primero apagado; Observe que este código se coloca antes del código JQM. (Desde el sitio web de JQM: dado que el evento mobileinit se activa de inmediato, deberá vincular su controlador de eventos antes de que se cargue jQuery Mobile. "). Obtenemos el hash de la página actual, pero no queremos actualizar algunos . páginas como la página principal

<script type="text/javascript"> 
     var needRedirect = false; 
     $(document).bind("mobileinit", function(){ 
      var thisPage = location.hash; 
      if (thisPage != '' && thisPage != '#homepage' && thisPage != '#page1') { 
       needRedirect = true; 
      } 
     }); 
    </script> 
    <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> 

y luego a la derecha en el comienzo de ustedes propio código:

if (needRedirect) { 
    $.mobile.changePage("#homepage"); 
    needRedirect = false; 
} 

Answer 2

Se podía agarrar la URL con el método en su $(function() {}); (que sólo se ejecuta al cargar la página), y si contiene un # continuación, redirigir a la página inicial.

Editar: o use window.onload = function ... como una alternativa pura de JS.

Answer 3

Bueno, esto es un comienzo, cada vez que navega a otra página que debe obtener el registro de actualización de la consola:

• http://jsfiddle.net/nkZQQ/5/

JS

$("div:jqmData(role='page')").live('pagehide',function(){ 
    console.log('page refreshed, redirect to home'); 
    $.mobile.changePage("#home", { transition: "slideup"}); 
});​ 

HTML

<div data-role="page" id="home"> 
    <div data-role="content"> 
     Hello Refresh 
     <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f"> 
      <li data-role="list-divider">Home</li> 
      <li><a href="#page2">Page 2</a></li> 
     </ul> 
    </div> 
</div> 

<div data-role="page" id="page2" data-theme="a"> 
    <div data-role="content"> 
     Hello Page 2 
     <ul data-role="listview" data-inset="true" data-theme="a" data-dividertheme="a"> 
      <li data-role="list-divider">Page 2</li> 
      <li><a href="#home">Home</a></li> 
     </ul> 
    </div> 
</div>​ 

Tal vez otro caso funcionaría mejor:

• http://jquerymobile.com/demos/1.1.0/docs/api/events.html

Answer 4

mi respuesta es similar a Parche de pero todo lo que hice fue añadir lo siguiente a la parte superior de mi archivo js de referencia local antes de la línea $ (documento) .ready. También podría agregarlo a una etiqueta de script HTML en cualquier lugar del encabezado, creo.

if (location.hash != "" && location.hash != "pageHome") { 
    var url = location.href; 
    url = url.replace(location.hash,""); 
    location.replace(url); 
} 

Answer 5

Llego un poco tarde, pero corrí con la idea de Patch para crear una solución muy simple. Tírelo en una etiqueta de script o en su archivo JS antes de $ (documento).listo()

checkPage(); 

function checkPage() { 
    var _hash = location.hash; 

    if (_hash != '' && _hash != "#home") { 
     var _url = location.href.replace(_hash, ""); 
     window.location.href = _url; 
    } 
} 

Answer 6

creo, esto es más simpe

$(document).on("pagebeforeshow", function() { 
    window.location = "page"; 
});