typecho開啟pjax,ajax,無刷新


1、引入jquery和pjax

  檢查你的網站是否引入1.7.0版本以上的jquery.js,如果沒有請全局引入

  https://files.cnblogs.com/files/fan-bk/pjax.js      pjax文件下載地址  pjax  body  代碼結束前引入pjax.js

 

2、添加pjax容器

  將body的id設置為 content

 

3、插入pjax代碼

  在主題footer文件 body結束標簽前面 添加代碼;

<div style="display:none; z-index:9999; background-color: #ea4961; position:fixed; top:0px; width:100%; height:100vh;" class="pjax_loading">
</div>
<script type="text/javascript" src="<?php $this->options->themeUrl('js/pjax.js'); ?>"></script> <!--引入pjax-->
<script>
$(document).pjax('a', '#content', {fragment:'#content', timeout:6000}); //這是a標簽的pjax,#content 表示執行pjax后會發生變化的id,改成你主題的內容主體id或class。timeout是pjax響應時間限制,如果在設定時間內未響應就執行頁面轉跳,可自由設置;
//$(document).on('submit', 'form', function (event) {$.pjax.submit(event, '#content', {fragment:'#content', timeout:6000});}); //這是提交表單的pjax。form表示所有的提交表單都會執行pjax,比如搜索和提交評論,可自行修改改成你想要執行pjax的form id或class。#content 同上改成你主題的內容主體id或class;
$(document).on('pjax:send', function() { //pjax鏈接點擊后顯示加載動畫;
    //$(".pjax_loading").css("display", "block");
});
$(document).on('pjax:complete', function() { //pjax鏈接加載完成后隱藏加載動畫;
    //$(".pjax_loading").css("display", "none");
    pajx_loadDuodsuo();//解決多說評論;
});
function pajx_loadDuodsuo(){
    var dus=$(".ds-thread");
    if($(dus).length==1){
        var el = document.createElement('div');
        el.setAttribute('data-thread-key',$(dus).attr("data-thread-key"));//必選參數
        el.setAttribute('data-url',$(dus).attr("data-url"));
        DUOSHUO.EmbedThread(el);
        $(dus).html(el);
    }
}
</script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM