Giới thiệu sơ lượt
Pjax là một plugin jQuery cung cấp trải nghiệm duyệt web cực kỳ nhanh (tải lại trang không cần làm mới) thông qua công nghệ ajax và pushState, đồng thời duy trì trang hiện tại, tiêu đề trang web và nút quay lại (chuyển tiếp) của trình duyệt cũng có thể được sử dụng bình thường.
Hướng dẫn cài đặt:
- Đầu tiên tải file đính kèm ở cuối bài viết về, sau đó up 2 tệp js lên website của bạn.
- Sau đó, thêm 2 javascript này vào <head> hoặc trước thẻ </body>
Hoặc
- Thêm code này vào
- Thêm đoạn javascript này vào trước thẻ </body>.
Giải thích:
• #pjax-content là id chứa nội dung khu vực pjax (tùy bạn đặt vị trí).
• timeout: Ajax sẽ tự kích hoạt làm mới nếu nó hết thời gian.
HTML ví dụ
* P/S: Về phần hiệu ứng mình sẽ nói sau!
Pjax là một plugin jQuery cung cấp trải nghiệm duyệt web cực kỳ nhanh (tải lại trang không cần làm mới) thông qua công nghệ ajax và pushState, đồng thời duy trì trang hiện tại, tiêu đề trang web và nút quay lại (chuyển tiếp) của trình duyệt cũng có thể được sử dụng bình thường.
Hướng dẫn cài đặt:
- Đầu tiên tải file đính kèm ở cuối bài viết về, sau đó up 2 tệp js lên website của bạn.
- Sau đó, thêm 2 javascript này vào <head> hoặc trước thẻ </body>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.pjax.js" type="text/javascript"></script>
- Thêm code này vào
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery.pjax/2.0.1/jquery.pjax.min.js"></script>$(document).pjax('a[target!=_blank]', '#pjax-content', {
fragment: '#pjax-content',
timeout: 8000
});
• #pjax-content là id chứa nội dung khu vực pjax (tùy bạn đặt vị trí).
• timeout: Ajax sẽ tự kích hoạt làm mới nếu nó hết thời gian.
HTML ví dụ
<!DOCTYPE html>
<html>
<head>
<!-- styles, scripts, etc -->
</head>
<body>
<h1>Trang PJAX cơ bản</h1>
<div class="container" id="pjax-content">
// Khu vực nội dung pjax.
</div>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.pjax.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).pjax('a[target!=_blank]', '#pjax-content', {
fragment: '#pjax-content',
timeout: 8000
});
</script>
</body>
</html>
* P/S: Về phần hiệu ứng mình sẽ nói sau!
tui không biết tiếng trung nên nhiều khi cũng ngại vọc mấy template có hán tự lắm 
