Làm thế nào để sử dụng PJAX? (? PJAX Với PHP)

Question

Tôi đã cố gắng để có được PJAX làm việc với trang web PHP của tôi, đây là đoạn code tôi đang sử dụng cho nó:

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

tôi chỉ sử dụng các mã họ sử dụng trên trang demo PJAX , nhưng thay thế vùng chứa mà họ đã sử dụng (#main) bằng vùng chứa cho trang web của tôi, đó là thẻ phần. Không có lỗi trên bảng điều khiển hoặc trên trang, nhưng nó không hoạt động! Trước khi tôi đã sử dụng

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

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

Nhưng khi tôi không sử dụng một trong những người và chỉ cần sử dụng $ ('ul a'). Pjax ('phần') Tôi thấy lỗi này trong giao diện điều khiển:

của router không chứa pjax cho phần trong jquery.pjax.js (line: 353)

tôi có thể nhận được một số giúp đỡ với điều này? Cảm ơn

Answer 1

Theo mặc định, pjax dự kiến ​​các trang mới sẽ được phân phối mà không có chrome - đoạn mã HTML sẽ được sử dụng làm innerHTML của vùng chứa.

Trong ví dụ của bạn, vùng chứa sẽ là thẻ <section> đầu tiên tôi giả sử. Tôi không biết nếu pjax đảm bảo rằng nó sẽ sử dụng yếu tố đầu tiên phù hợp với một bộ chọn - nó chỉ có thể thay thế mọi phần tử phù hợp. Có lẽ sẽ tốt hơn nếu sử dụng bộ chọn ID, chẳng hạn như #main.

Dù sao, có vẻ như bạn không phân phối đoạn mã HTML, nhưng chỉ toàn bộ trang. Điều này gần như đánh bại mục đích của pjax, nhưng nó có thể được hỗ trợ bằng cách xác định một đoạn trong nội dung tải xuống. Hầu như luôn luôn điều này sẽ là một bộ chọn phù hợp với container sẽ được thay thế.

Vì vậy, giả sử bạn sử dụng một container với @id=main bạn có thể gọi pjax với

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

Hãy chắc chắn rằng pjax được gọi sau khi tải tài liệu, nếu không tra cứu container sẽ thất bại.

Nhân tiện, một cách dễ dàng hơn để chuyển sang điều hướng được hỗ trợ bởi pushState là với dự án HTMLDecor của tôi. Nó đòi hỏi bạn phải thay đổi quan điểm của bạn trên việc tạo ra các trang HTML, nhưng một khi bạn đã làm điều đó bạn chỉ cần thêm kịch bản HTMLDecor.js vào các trang của bạn và pushState được sử dụng tự động khi thích hợp - không cần cấu hình.