方法非常简单,首先引入 jquery.js 和 jquery.pjax.js
<script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<script src="//cdn.bootcss.com/jquery.pjax/1.9.6/jquery.pjax.min.js"></script>
然后在body内放一个div作为容器,并设置一个id,我设置的id是pjax-container
。
<div id="pjax-container">
//在此处放置跳转页面时要更新的部分
</div>
然后在容器外添加以下代码
<script type="text/javascript">
$(document).pjax('a[href^="<?php Helper::options()->siteUrl()?>"]:not(a[no-pjax])', {
container: '#pjax-container',
fragment: '#pjax-container',
timeout: 8000
}).on('pjax:send', function() { //Pjax加载中执行
$("#pjax_loading").show(); //显示遮罩层与加载动画
}).on('pjax:complete', function() { //Pjax加载完成执行
$("#pjax_loading").hide(); //隐藏遮罩层与加载动画
});;
</script>
参考文章:https://www.ihewro.com/archives/354/