2012-04-04 22 views
11

yo estaba tratando de conseguir PJAX trabajar con mi sitio de PHP, este es el código que estoy utilizando para ello:¿Cómo usar PJAX? (? PJAX Con PHP)

<script src="js/jquery.js"></script> 
<script src="js/jquery.pjax.js"></script> 
    <script type="text/javascript"> 
     $(function(){ 
      // pjax 
      $('ul a').pjax('section') 
     }) 
    </script> 

sólo estoy usando el código que usaban en la página de demostración PJAX , pero reemplazando el contenedor que usaron (#main) con el de mi sitio, que era la etiqueta de la sección. No hay errores en la consola o en la página, ¡pero tampoco funciona! Antes de que yo estaba usando

$(function() { $('ul a').pjax('section') }); y

$('document').ready(function(){ 
    $('ul a').pjax('section') 
}); 

Pero cuando yo no uso ninguna de las dos y sólo tiene que utilizar $ ('ul a'). Pjax ('sección') Veo este error en la consola:

no detectada ningún contenedor pjax para la sección de línea (jquery.pjax.js: 353)

¿Puedo obtener alguna ayuda con esto? Gracias

+0

¿Su página tiene una etiqueta '

' en ella? ¿El servidor devuelve contenido sin chrome cuando se envían el encabezado 'X-PJAX' o el parámetro de búsqueda' _pjax'? ¿Puedes vincular a una URL de demostración? –

+0

En realidad, no pude cargar el material de PHP, pero probé exactamente lo mismo con simples archivos html simples, pero sigue siendo lo mismo. Puede ver esto aquí: http://sbtest.comoj.com – user1302430

+0

En ese sitio de prueba, reemplace su llamada pjax con '$ (función() {$ ('ul a'). Pjax (" # main ", {fragmento : "#main"});}); '. O coloca la llamada en la parte inferior de la página. –

Respuesta

10

De forma predeterminada, pjax espera que se entreguen nuevas páginas sin el cromo, un fragmento de HTML que se utilizará como innerHTML del contenedor.

En su ejemplo, el contenedor sería la primera etiqueta <section>, supongo. No sé si pjax garantiza que usará el primer elemento que coincida con un selector; puede reemplazar a cada elemento coincidente. Probablemente sea mejor utilizar un selector de ID, como #main.

De todos modos, parece que no estaba entregando fragmentos de HTML, sino solo toda la página. Esto casi frustra el propósito de pjax, pero puede ser respaldado especificando un fragmento en el contenido descargado. Casi siempre, este será un selector que coincida con el contenedor que se reemplazará.

Por lo tanto, suponiendo que el uso de un recipiente con @id=main que se podría llamar pjax con

$(function() { $("ul a").pjax("#main", { fragment: "#main" }); }); 

Asegúrese de que pjax se llama una vez cargado el documento, de lo contrario la consulta de contenedor fallará.

Por cierto, una forma más fácil de cambiar a la navegación asistida por pushState es con mi proyecto HTMLDecor. Requiere que cambies tu perspectiva sobre la generación de páginas HTML, pero una vez que lo hayas hecho, solo tienes que agregar el script HTMLDecor.js a tus páginas y pushState se usa automáticamente cuando sea necesario, sin necesidad de configuración.