github-style
github-style copied to clipboard
Published
20 hours ago •
MeiK2333
MeiK2333
pjax刷新区域的选择。
作者大大，最近又在折腾博客，加了一些动态元素，但是每次跳转页面都会刷新，导致动画元素、或者后台歌曲重新加载。
后来无意中发现了pjax，经过一番折腾也实现了无刷新加载。
我的操作如下：
extended_head.html下引入
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery.pjax/2.0.1/jquery.pjax.min.js"></script>
<script>
$(document).pjax('a[target!=_blank]', '#pageContent', {fragment: '#pageContent'});
</script>
用<div id="pageContent"></div>包裹刷新区域，不想刷新的区域用了其他的内容划分。
但是奈何才疏学浅，刷新区域的选择还是有问题，导致某些应该正常加载的页面不加载了：
1.Overview下的Post activity、以及贡献图不加载了；
2.post页面下的目录失效，点击无反应；
3.gitalk不刷新。
想请教我的哪些思路出了问题，又或者作者大大能不能给出更好的方案。 感恩😋
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body style="margin:0; padding:0;overflow:hidden">
<iframe src="http://www.luvsia.com/" frameborder="0"
style="overflow:hidden;height:100%;width:100%;position:absolute;top:0;left:0;right:0;bottom:0"
height="100%" width="100%"></iframe>
<!--
在这里写你想保持的内容，比如音乐等
-->
</body>
</html>
大概这样
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body style="margin:0; padding:0;overflow:hidden"> <iframe src="http://www.luvsia.com/" frameborder="0" style="overflow:hidden;height:100%;width:100%;position:absolute;top:0;left:0;right:0;bottom:0" height="100%" width="100%"></iframe> <!-- 在这里写你想保持的内容，比如音乐等 --> </body> </html>大概这样
