jquery-mobile - online - jquery mobile tutorial
(Resuelto) Problema con la navegación de varias páginas usando jQuery Mobile Framework en IBM Worklight (1)
Vea este proyecto para una aplicación basada en Worklight 6.2 usando el widget Pagecontainer de jQuery Mobile 1.4.3.
En la aplicación, haga clic en un botón para pasar de index.html a page1.html utilizando:
HTML
<a href="#" data-role="button" id="button-mainpage" onclick="changeToPage1();">load page1</a>
JavaScript
function changeToPage1() {
$('':mobile-pagecontainer'').pagecontainer(''change'',''page1.html'');
}
También puede echar un vistazo a las siguientes preguntas que se responden con explicaciones y ejemplos de proyectos para usar changePage .
Tenga en cuenta que los proyectos pueden ser de Worklight 6.0 y 6.1 en lugar de 6.2, pero eso no importa ya que aquí se trata de JavaScript, simplemente revíselo.
- Cómo cambiar entre páginas usando Jquery Mobile en Worklight
- IBM Workligt Single HTML file que contiene todas las páginas de la aplicación: ¿cómo cargar una nueva página?
- IBM Worklight 6.1 - ¿Por qué el código de Cordova no funciona cuando se coloca en una subpágina?
- IBM Worklight: fragmentación de la página
- IBM Worklight: errores de navegación en una aplicación de varias páginas
En todos ellos, la idea es que Worklight sea una aplicación de una sola página. Por lo tanto, no puede cargar otro archivo HTML y esperar que la aplicación continúe funcionando. Al hacerlo, se pierde el "contexto" del marco Worklight: las referencias a los archivos JS incluidos, etc.
En su lugar, puede usar la load jQuery o la página de cambio de jQuery Mobile (obsoleta en v1.4, que se eliminará en v5), para cargar diferentes "páginas". Ejemplos amplios se proporcionan arriba.
Esta pregunta ya tiene una respuesta aquí:
Estoy desarrollando una aplicación de banca móvil de muestra en IBM Worklight V6.2 utilizando jQuery Mobile Framework. Leí la documentación de Getting Started en IBM Worklight y se menciona una forma de implementar la navegación de varias páginas utilizando fragmentos. Sin embargo, también establece que si está utilizando un marco de interfaz de usuario de JavaScript, use su API en su lugar.
Leí en el método jQuery Mobile pagecontainer y lo estoy implementando de la siguiente manera:
<li><a href="#" onclick="$('':mobile-pagecontainer'').pagecontainer( ''change'', ''BranchLocations.html'' )" id="item1">Branch Locations</a></li>
Sin embargo, aparece el problema de que la página enlazada se carga después de hacer clic en el vínculo, pero la página original se vuelve a cargar. ¿Podría alguien explicarme por qué sucede esto? ¿Es esto un problema conocido?
Encontré el problema. Tenía un enlace a la
<script src="jqueryMobile/jquery.mobile-1.4.3.js"></script>
En las páginas enlazadas. Esa es la razón por la que estaba reiniciando la página de índice original.