Iscroll no se carga en un enlace hash en jQuery Mobile

Question

He configurado un IScroll en un divisorio en una de mis páginas de detalles en un sitio móvil jQuery. Básicamente, lo que sucede es que cuando hago clic en el botón en la página principal (para una página 'Acerca de') va a la ubicación con un enlace hash (usando Ajax de lo que he reunido). Ejemplo:

http://www.example.com/#about.php (Esto no funciona con Iscroll, por cierto, esto obviamente no es una URL real, solo un ejemplo de sintaxis)

Básicamente, cuando cargo la URL por sí solo (como un enlace no molesto), el IScroll funciona bien, pero cuando se carga desde la página principal, el IScroll no se carga y no funciona. Ejemplo:

http://www.example.com/about.php

¿Cómo consigo el ancla para el <li> Para vincular el enlace directo y no al enlace hash o es mejor aprender cómo hacer que el JavaScript de Iscroll se cargue en el enlace cargado de AJAX? Gracias por la ayuda.

ACTUALIZAR:

Aquí está la sintaxis que he usado para ListView que he vinculado a la página Acerca de. Es la sintaxis básica de ListView que he visto usado en todas partes que he leído. Todo lo que estoy tratando es el quinto enlace en este momento (sobre). No estoy usando un hash en el ancla y aún así lo vincula a una ubicación hash. Lo interesante es que no es http://www.example.com/index.php#about.php es solo http://www.example.com/#about.php.

<ul data-role="listview">
        <li><a href="#nav1">TEST</a></li>
        <li><a href="#nav1">TEST 2</a></li>
        <li><a href="#nav1">TEST 3</a></li>
        <li><a href="#nav1">TEST 4</a></li>
        <li><a href="about.php">ABOUT</a></li>
 </ul>

Answer 1

Supongo que estás vinculando la inicialización de Iscroll dentro de un document.ready manipulador. Si este es el caso, entonces debe cambiar eso a un controlador de eventos delegado (esta es la práctica móvil jQuery estándar):

$(document).delegate('#about-page-id', 'pageinit', function () {
    var myScroll = new iScroll('id-of-element');
});

IMPORTANTE: Use PageInit (), no $ (documento) .Ready ()

Lo primero que aprende en jQuery es llamar al código dentro de la función $ (documento) .Ready () para que todo se ejecute tan pronto como se cargue el DOM. Sin embargo, en jQuery Mobile, AJAX se usa para cargar el contenido de cada página en el DOM mientras navega, y el controlador DOM Ready solo se ejecuta para la primera página. Para ejecutar código siempre que se cargue y cree una nueva página, puede vincular al evento PageInit. Este evento se explica en detalle en la parte inferior de esta página.

Fuente: http://jquerymobile.com/demos/1.0/docs/api/events.html

La historia larga se quedó corta: JQuery Mobile usa AJAX para atraer nuevas páginas al DOM, esto tiene una serie de afectos secundarios.

1. Todas las ID deben ser únicas en todo el sitio ya que varias páginas pueden estar en el DOM a la vez.
2. Al vincular a una página externa (<a href="about.html">About</a>) Solo el data-role="page" Element y sus descendientes serán agarrados (todo lo demás será ignorado).
3. No puedes confiar en $(document).ready() Porque las páginas agarradas a través de Ajax no disparan este evento, disparan page events Como se especifica aquí: http://jquerymobile.com/demos/1.0/docs/api/events.html

Si desea forzar una recarga al vincular a otra página, hay varias opciones:

1. Poner rel="external" on the link tag:`
2. Poner data-ajax="false" En la etiqueta de enlace: <a data-ajax="false" href="about.html"></a>
3. Desactivar globalmente el manejo de enlaces AJAX: http://jquerymobile.com/demos/1.0/docs/api/globalconfig.html

Pero tenga en cuenta que el uso de cualquiera de estos métodos deshabilitará las transiciones.

ACTUALIZAR

Si está obteniendo enlaces de hash, eso significa que apagó el historyPushState Funcionalidad o está utilizando una versión anterior de jQuery Mobile. Si está utilizando una versión antigua, recomiendo actualizar a 1.0 (hay muchos aumentos de rendimiento en 1.0 RC3 y 1.0 final): http://jquerymobile.com/download/