0.7.0
1 把部分CSS移入style.css 2 加入点击加载的文章列表展示方式 3 修改了nopic.svg的大小 4 修复特定分类下的显示功能
This commit is contained in:
parent
077bd0f720
commit
5ca790f631
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 6.7 KiB |
|
@ -1,48 +1,70 @@
|
|||
// 加载更多文章
|
||||
$(document).on('click', '.post-read-more a', function(e){
|
||||
document.addEventListener('click', function (e) {
|
||||
// 检查点击的元素是否是 .post-read-more a
|
||||
if (e.target.closest('.loadmore a')) {
|
||||
e.preventDefault();
|
||||
var $btn = $(this);
|
||||
var nextPage = $btn.attr('href');
|
||||
|
||||
if($btn.hasClass('loading')) return false;
|
||||
|
||||
$btn.addClass('loading').text('加载中...');
|
||||
|
||||
$.ajax({
|
||||
url: nextPage,
|
||||
type: 'GET',
|
||||
dataType: 'html',
|
||||
success: function(data){
|
||||
// 创建一个临时的DOM元素来解析返回的HTML
|
||||
var $html = $('<div></div>').html(data);
|
||||
|
||||
var btn = e.target.closest('.loadmore a');
|
||||
var nextPage = btn.getAttribute('href');
|
||||
|
||||
// 防止重复点击
|
||||
if (btn.classList.contains('loading')) return false;
|
||||
|
||||
btn.classList.add('loading');
|
||||
btn.textContent = '加载中...';
|
||||
|
||||
// 发起 AJAX 请求
|
||||
fetch(nextPage)
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok');
|
||||
}
|
||||
return response.text();
|
||||
})
|
||||
.then(data => {
|
||||
// 创建一个临时的 DOM 元素来解析返回的 HTML
|
||||
var parser = new DOMParser();
|
||||
var htmlDoc = parser.parseFromString(data, 'text/html');
|
||||
|
||||
// 找到新的文章
|
||||
var $newPosts = $html.find('.post_loop');
|
||||
|
||||
var newPosts = htmlDoc.querySelectorAll('.post--item');
|
||||
|
||||
// 找到新的"加载更多"按钮
|
||||
var $newBtn = $html.find('.post-read-more a');
|
||||
|
||||
// 将新文章添加到页面
|
||||
if ($newPosts.length > 0) {
|
||||
$('.post_box').append($newPosts);
|
||||
var newBtn = htmlDoc.querySelector('.nav-links a');
|
||||
|
||||
// 获取文章列表容器和加载更多按钮
|
||||
var postReadMore = document.querySelector('.nav-links');
|
||||
var articleList = document.querySelector('.articleList');
|
||||
|
||||
if (newPosts.length > 0) {
|
||||
newPosts.forEach(post => {
|
||||
articleList.insertBefore(post, postReadMore);
|
||||
});
|
||||
|
||||
// 新文章淡入效果
|
||||
$newPosts.hide().fadeIn(500);
|
||||
Array.from(newPosts).forEach(post => {
|
||||
post.style.opacity = 0;
|
||||
setTimeout(() => {
|
||||
post.style.transition = 'opacity 0.5s';
|
||||
post.style.opacity = 1;
|
||||
}, 10);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// 更新"加载更多"按钮或移除它
|
||||
if($newBtn.length > 0){
|
||||
$btn.attr('href', $newBtn.attr('href'))
|
||||
.removeClass('loading')
|
||||
.text('加载更多');
|
||||
if (newBtn) {
|
||||
btn.setAttribute('href', newBtn.getAttribute('href'));
|
||||
btn.classList.remove('loading');
|
||||
btn.textContent = '加载更多';
|
||||
} else {
|
||||
$('.post-read-more').remove();
|
||||
// 如果没有更多的按钮,移除 .post-read-more
|
||||
if (postReadMore) {
|
||||
postReadMore.remove();
|
||||
}
|
||||
}
|
||||
},
|
||||
error: function(xhr, status, error){
|
||||
console.error("AJAX Error:", status, error);
|
||||
$btn.removeClass('loading').text('加载失败,点击重试');
|
||||
}
|
||||
});
|
||||
|
||||
return false;
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
console.error("AJAX Error:", error);
|
||||
btn.classList.remove('loading');
|
||||
btn.textContent = '加载失败,点击重试';
|
||||
});
|
||||
}
|
||||
});
|
|
@ -19,20 +19,6 @@ function themeConfig($form) {
|
|||
$form->addInput($twitterurl);
|
||||
$mastodonurl = new Typecho_Widget_Helper_Form_Element_Text('mastodonurl', NULL,'https://jiong.us/', _t('mastodon'), _t('会在个人信息显示'));
|
||||
$form->addInput($mastodonurl);
|
||||
$sitemapurl = new Typecho_Widget_Helper_Form_Element_Text('sitemapurl', NULL, NULL, _t('sitemap'), _t('会在页脚显示'));
|
||||
$form->addInput($sitemapurl);
|
||||
$cnavatar = new Typecho_Widget_Helper_Form_Element_Text('cnavatar', NULL, 'https://cravatar.cn/avatar/', _t('Gravatar镜像'), _t('默认https://cravatar.cn/avatar/,建议保持默认'));
|
||||
$form->addInput($cnavatar);
|
||||
$midimg = new Typecho_Widget_Helper_Form_Element_Text('midimg', NULL, '/img/', _t('填写分类图片路径,以"/"结尾'), _t('默认使用网站根目录下的img文件夹,也可以填写绝对或者CDN地址,自动匹配目录下以分类ID为文件名的mid.jpg格式的图片'));
|
||||
$form->addInput($midimg);
|
||||
$donate = new Typecho_Widget_Helper_Form_Element_Text('donate', NULL, 'https://blogcdn.loliko.cn/donate/wx.png', _t('赞赏二维码'), _t('不填写则不显示'));
|
||||
$form->addInput($donate);
|
||||
$twikoo = new Typecho_Widget_Helper_Form_Element_Textarea('twikoo', NULL, NULL, _t('引用第三方评论'), _t('不填写则不显示'));
|
||||
$form->addInput($twikoo);
|
||||
$addhead = new Typecho_Widget_Helper_Form_Element_Textarea('addhead', NULL, NULL, _t('添加head'), _t('支持HTML'));
|
||||
$form->addInput($addhead);
|
||||
$tongji = new Typecho_Widget_Helper_Form_Element_Textarea('tongji', NULL, NULL, _t('统计代码'), _t('支持HTML'));
|
||||
$form->addInput($tongji);
|
||||
$showProfile = new Typecho_Widget_Helper_Form_Element_Radio('showProfile',
|
||||
array('0'=> _t('否'), '1'=> _t('是')),
|
||||
'0', _t('是否在文章页面显示作者信息'), _t('选择“是”将在文章页面包含显示作者信息。'));
|
||||
|
@ -53,6 +39,24 @@ function themeConfig($form) {
|
|||
array('0'=> _t('否'), '1'=> _t('是')),
|
||||
'0', _t('是否显示页面加载时间'), _t('选择“是”将在页脚显示加载时间。'));
|
||||
$form->addInput($showtime);
|
||||
$loadmore = new Typecho_Widget_Helper_Form_Element_Radio('loadmore',
|
||||
array('0'=> _t('加载更多'), '1'=> _t('页码模式')),
|
||||
'0', _t('加载文章列表方式'), _t('加载更多将在文章列表底部显示加载更多按钮'));
|
||||
$form->addInput($loadmore);
|
||||
$sitemapurl = new Typecho_Widget_Helper_Form_Element_Text('sitemapurl', NULL, NULL, _t('sitemap'), _t('会在页脚显示'));
|
||||
$form->addInput($sitemapurl);
|
||||
$cnavatar = new Typecho_Widget_Helper_Form_Element_Text('cnavatar', NULL, 'https://cravatar.cn/avatar/', _t('Gravatar镜像'), _t('默认https://cravatar.cn/avatar/,建议保持默认'));
|
||||
$form->addInput($cnavatar);
|
||||
$midimg = new Typecho_Widget_Helper_Form_Element_Text('midimg', NULL, '/img/', _t('填写分类图片路径,以"/"结尾'), _t('默认使用网站根目录下的img文件夹,也可以填写绝对或者CDN地址,自动匹配目录下以分类ID为文件名的mid.jpg格式的图片'));
|
||||
$form->addInput($midimg);
|
||||
$donate = new Typecho_Widget_Helper_Form_Element_Text('donate', NULL, 'https://blogcdn.loliko.cn/donate/wx.png', _t('赞赏二维码'), _t('不填写则不显示'));
|
||||
$form->addInput($donate);
|
||||
$twikoo = new Typecho_Widget_Helper_Form_Element_Textarea('twikoo', NULL, NULL, _t('引用第三方评论'), _t('不填写则不显示'));
|
||||
$form->addInput($twikoo);
|
||||
$addhead = new Typecho_Widget_Helper_Form_Element_Textarea('addhead', NULL, NULL, _t('添加head'), _t('支持HTML'));
|
||||
$form->addInput($addhead);
|
||||
$tongji = new Typecho_Widget_Helper_Form_Element_Textarea('tongji', NULL, NULL, _t('统计代码'), _t('支持HTML'));
|
||||
$form->addInput($tongji);
|
||||
}
|
||||
function saveThemeConfig($config) {
|
||||
// 可以在这里添加额外的验证或处理逻辑
|
||||
|
|
|
@ -164,6 +164,7 @@ foreach ($normalPosts as $normalPost) {
|
|||
<?php endif; ?>
|
||||
</article>
|
||||
<?php endwhile; ?>
|
||||
<?php if ($this->options->loadmore): ?>
|
||||
<?php
|
||||
$this->pageNav(
|
||||
' ',
|
||||
|
@ -181,4 +182,15 @@ foreach ($normalPosts as $normalPost) {
|
|||
'nextClass' => 'hidden'
|
||||
)
|
||||
);
|
||||
?>
|
||||
?>
|
||||
<?php else:?>
|
||||
<?php
|
||||
$nextPage = $this->_currentPage + 1;
|
||||
$totalPages = ceil($this->getTotal() / $this->parameter->pageSize);
|
||||
if ($this->_currentPage < $totalPages): ?>
|
||||
<div class="nav-links">
|
||||
<span class="loadmore"><?php $this->pageLink('加载更多', 'next'); ?></span>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<script src="<?php $this->options->themeUrl('assets/js/loadmore.js'); ?>"></script>
|
||||
<?php endif; ?>
|
|
@ -146,33 +146,6 @@ img {
|
|||
height: 480px;
|
||||
}
|
||||
}
|
||||
.load-more-btn {
|
||||
display: block;
|
||||
margin: 20px auto;
|
||||
padding: 10px 20px;
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.load-more-btn:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
.nav-links .loadmore {
|
||||
border: 1px solid var(--farallon-border-color);
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
padding: 5px 30px;
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
color: var(--farallon-text-gray)
|
||||
}
|
||||
|
||||
.nav-links .loadmore:hover {
|
||||
border-color: var(--farallon-hover-color);
|
||||
color: var(--farallon-hover-color)
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
<?php $this->need('./module/footer.php'); ?>
|
||||
|
|
|
@ -166,34 +166,7 @@ img {
|
|||
.resimg {
|
||||
grid-template-columns: 1fr; /* 修改为一列 */
|
||||
}
|
||||
}
|
||||
.load-more-btn {
|
||||
display: block;
|
||||
margin: 20px auto;
|
||||
padding: 10px 20px;
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.load-more-btn:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
.nav-links .loadmore {
|
||||
border: 1px solid var(--farallon-border-color);
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
padding: 5px 30px;
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
color: var(--farallon-text-gray)
|
||||
}
|
||||
|
||||
.nav-links .loadmore:hover {
|
||||
border-color: var(--farallon-hover-color);
|
||||
color: var(--farallon-hover-color)
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
<?php $this->need('./module/footer.php'); ?>
|
||||
|
|
Loading…
Reference in New Issue