当前网上关于typecho实现pjax的文章层出不穷,这里出一版简单版本。当前主题与pjax存在一些冲突,正在调整中,相信后续就可以用上pjax了。

1、引入js并配置相关参数
在footer.php的</body>前面添加

<script src="//cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>

<script src="//cdn.bootcss.com/jquery.pjax/2.0.1/jquery.pjax.min.js"></script>

<script>
$(document).pjax('a[href^="<?php Helper::options()->siteUrl()?>"]:not(a[target="_blank"], a[no-pjax])', {
    container: '#container',
    fragment: '#container',
    timeout: 8000
}).on('pjax:send',
function() {
    NProgress.start();//加载动画效果开始
}).on('pjax:complete',
function() {
   loadMeting(); //Meting播放器
   imageeffct();//灯箱函数重载
   NProgress.done();//加载动画效果结束
   setupContents();//某个函数重载
   lue();//lue函数重载
   reHighlightCodeBlock();//代码高亮函数重载
   Prism.highlightAll(); //Prism代码高亮
   hljs.initHighlightingOnLoad(); //highlight代码高亮
});
</script>

2、添加内容变换容器
在header.php的<body>之后添加

<div id="container">

在footer.php的<?php $this->footer(); ?>之前添加

</div>

说明:Typecho的插件是把需要添加在页面的HTML代码插入到这里:<?php $this->footer(); ?>,
所以为了不让音乐播放器被添加到#container的div中,
我将 <?php $this->footer(); ?> 放在了id为container的div之后。

作者:https://devoted2.site/748.html