使用全局无刷新效果可以让页面在点击“_self”链接跳转时不刷新本页面，背景音乐、视频等不会因为跳转而停止播放，省去了浏览器重载，页面响应也会相应地提升。下面直接上代码！
先是head头部部分： [HTML] 纯文本查看 复制代码 <!--Pjax无刷新引入，放在<body>标签后-->
<script src="//cdn.bootcdn.net/ajax/libs/jquery.pjax/2.0.1/jquery.pjax.js"></script>
<div id="pjaxPage">
<!--end Pjax无刷新引入，放在<body>标签后--> 接下来是底部： [HTML] 纯文本查看 复制代码 <!--Pjax无刷新引入，放在底部</body>标签前-->
<script>
$(function() {
$(document).pjax('a[target!=_blank]', '#pjaxPage', {fragment:'#pjaxPage', timeout:6000});
$(document).on('pjax:send', function() {
$('#pjaxLoading').show();
});
$(document).on('pjax:complete', function() {
$('#pjaxLoading').hide();
});
});
</script>
</div>
<!--end Pjax无刷新引入,放在头部</body>标签前-->接下来是加载动画部分，添加在任意位置，推荐放在无刷新底部引入代码之上： [HTML] 纯文本查看 复制代码 <!--Loading动画-->
<link rel="stylesheet" type="text/css" href="/pjaxLoading.css">
<div id="pjaxLoading" style="display: none;">
<div class="loading_frame">
<div class="loader_overlay"></div>
<div class="loader_cogs">
<div class="loader_cogs__top">
<div class="top_part"></div>
<div class="top_part"></div>
<div class="top_part"></div>
<div class="top_hole"></div>
</div>
<div class="loader_cogs__left">
<div class="left_part"></div>
<div class="left_part"></div>
<div class="left_part"></div>
<div class="left_hole"></div>
</div>
<div class="loader_cogs__bottom">
<div class="bottom_part"></div>
<div class="bottom_part"></div>
<div class="bottom_part"></div>
<div class="bottom_hole"></div>
</div>
</div>
</div>
</div>
<!--end Loading动画-->
| 
发表于 2020-6-17 23:00:57
请点击此处下载
发表于 2020-7-10 12:35:28
