zoukankan      html  css  js  c++  java
  • 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; 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>
  • 相关阅读:
    TP6|TP5.1 PHPoffice导出|导入
    centOS 7 环境搭建之安装 Redis
    centOS 7 环境搭建之安装 MySQL
    双向循环链表(DoubleLoopLinkList)
    双向链表(DoubleLinkList)
    可执行程序的编译过程
    C语言文件操作
    C语言跨平台时间操作计算时间差
    C语言线程安全问题
    C++类型双关
  • 原文地址:https://www.cnblogs.com/fan-bk/p/8417686.html
Copyright © 2011-2022 走看看