当前位置:
  1. 首页 »
  2. 教程 »
  3. 正文

JQAJAX实现wordpress无限下拉显示

零分 2,474

wordpress无限下拉分页实现方法:

通过JQ的AJAX来实现无限下拉分页,原理是通过JQAJAX获取下一页的html,提取指定内的文章列表放入当前页的指定容器内!

JQ ajax代码:

$.ajax({
var geturl=$("#getpage a").attr("href");//下一页的链接
$("#getpage a").html("正在加载,请稍后....");//显示下一页链接的文本标签
type: "POST",
url: geturl,
success: function(data){
result = $(data).find("#thelist");//指定容器内的文章列表
page=$(data).find("#page");//获取分页导航
nextHref = $(data).find("#getpage a").attr("href");//获取下一页的链接,替换当前页的下一页链接
$("#thelist").append(result);//最近文本列表,显示下一页
$("#page").html(page);//替换分页导航
if(nextHref!=undefined ){
$("#getpage a").html("加载下一页");//替换下一页链接的文本标签
$("#getpage a").attr("href",nextHref)//替换下一页链接
}else{
$("#getpage").remove();//最后一页,已经全部加载完成时,移除下一页标签
}
}
});

wordpress模板PHP代码,先显示第一页

<div id="thelist">
<?php while (have_posts()) : the_post();?>
<div class="theli thewidth ">
<div class="img">
<span class="ib imgbox">
<a rel="bookmark" target="_blank" href="<?php echo get_the_permalink(); ?>"><img src="<?php echo post_thumbnail();?>"></a>
<i class="ib cat"><a rel="bookmark" href="<?php echo get_category_link(get_the_category()[0]->term_id); ?>"><?php echo get_the_category()[0]->name ;?></a></i>
</span>
</div>
<div class="content">
<h2><a rel="bookmark" target="_blank" href="<?php echo get_the_permalink(); ?>"><?php the_title();?></a></h2>
<p class="ib info">
<i class="ib line"><?php the_author();?></i>
<i class="ib line"><?php time_tran(get_the_time('U'));?></i>
<?php if(get_the_tags()){$thistag='';foreach(get_the_tags() as $tag){$thistag.= '<a target="_blank" rel="bookmark" href="'.get_bloginfo('url').'/tag/'.$tag->name.'">'.$tag->name.'</a>,';} echo '<i class="ib line m_none">'.rtrim($thistag,",").'</i>';} ?>
<i class="ib li"><?php post_views('阅读(', ')'); ?></i>
</p>
<div class="text"><?php echo strip_tags(apply_filters('the_content', $post->post_content)); ?></div>
</div>
<div class="btnbox">
<a rel="bookmark" target="_blank" href="<?php echo get_the_permalink(); ?>"><span class="ib link">阅读全文</span></a>
</div>
</div>
<?php endwhile;wp_reset_query(); ?>
</div>
<div id="page"><?php par_pagenavi($pn); ?></div>
<div id="getpage"><?php echo get_next_posts_link('加载下一页'); ?></div>

wordpress无限下拉加载大概就时这种,其实,不管什么程序,下拉无限下载,也差不多都时这样的写法。

wordpress禁用REST API导致古腾堡编辑器发布文章出错问题

wordpress禁用REST API,在function.php中加入以下代码: add_filter("json_enabled", "__return_false"); add_filter("json_jsonp_enabled", "__return_false"); add_filter("rest_enabled", "__return_false"); add_filter("rest_jsonp_enabled", "__return_false"); remove_action("init", "rest_api_init"); remove_action("rest_ap
笔记 1,380

wordpress 后台主题设置选项按钮(button、input submit)点击屏蔽提交事件禁止刷新

wordpress 后台主题设置选项按钮(button、input submit)点击屏蔽提交事件禁止刷新 如果在设计主题或者插件后台设置选项时,wordpress后台的按钮(button、input submit)默认是提交操作,如只是响应JS事件,需要屏蔽提交,防止页面刷新。e.preventDefault(); 完整示例: $("button.copy").on("click",function(e){ e.preventDefault(); JS操作 });
笔记 1,262

wordpress 过滤垃圾评论有效方法

wordpress不管站是什么样的,只要开启了评论,就会有垃圾评论来光顾。这些垃圾评论,都有一个共同点,那就是全英文。 既然是全英文,对于国人,那就暴力一点,直接过滤点不含中文的评论。 在主题functions.php中添加: function my_comment_spam_filter($comment_id) { $comment = get_comment($comment_id); if (!preg_match('/[\x{4e00}-\x{9fa5}]/u',$comment->comment_content)) { wp_delete_com
笔记 2,419

wordpress评论模块,好久没写过了,大概是忘记了

不知道什么时候开始,或许是因为备案要求不能有交互式内容吧,自用模板都没有写评论模块 或许还有一个原因,就是垃圾评论太多了 很多网站都设置了登录才能评论,也别说评论了,现在估计也很少写文字了​。 今天要写一个留言板,需要评论模块,感觉都忘记了,查了下wordpress的评论模块函数 comment_form()​:评论表单 wp_list_comments()​:帖子列表 刚开始放上去,没有输出,依稀记得,wordpress是有内置表单的,不可能不会有输出的问题​。 这个评论是放在页面上的,理论上和文章模块都是一样的。原本以为是不支持页面,放文章页,也是不显示,​到后台看了下,原来是关闭了评论。
随笔 2,767

wordpress 分类页获取分类名称及该分类信息并显示文章数量

有一个这样的需求,要在分类页显示该分类下的所有文章数量,网上的写法大致都是用循环去叠加该分类下子分类的文章数量。 但是,其实最简单的写法是自己调用内置函数获取文章数量,包括在首页显示全站的所有文章数量。 $wp_query->found_posts 为了验证这个函数,我特意建立了一个空白的主题,在每个页面上都打印出 $wp_query 这个函数。 wordpresss主题主要的几个文件: header:页头 footer:页脚 index:主页 category:分类页 single:文章模板 page:页面模板 search:搜索模板 tag:标签模板 functions:函数文件 head
笔记 1,884