网站最后更新日期:2018年8月29日
欢迎大家来到畅想资源 AREFLY.COM! 个人网站 更多联络方式
×

【纯代码】为WordPress添加AJAX无刷新之评论分页功能

WordPress默认自带一个“评论分页”功能,可以方便的防止过多评论导致页面过长,但是当访客在切换评论时,页面需要不停地经过刷新、加载,降低访客体验,而今天“畅想资源”就来教大家如何为WordPress添加AJAX无刷新的评论分页功能,提升网站的用户体验! :mrgreen:

预览

可参考本站“留言本”页面! :grin:

教学

提示:在开始进行以下步骤前,请先确定你的网站已经成功加载jQuery库!

1、首先于主题的“评论 (comments.php)”文件内的“评论主题DIV(例如 commentlist 等)”的DIV外添加 <div id="loading-comments"><span>评论加载中,请稍等...</span></div>

wordpress-ajax-comment-pages-1

2、然后将下列代码新增为JS文件(例如“ajax-comment-pages.js”等)并储存至WordPress主题目录下,然后在网页内使用 script 来引用该文件即可!

注意:请根据各行注释将相关DIV的 idclass 进行适当修改后方可于网页内正常使用!

3、现在在网页内试试看点击你的评论分页,是不是已经可以实现无刷新加载了?如果还不行,请确定DIV是否已经设定正常,或者于下方留言说明问题,本站将会尽力帮你解决! :razz:

参考

WordPress Ajax 评论分页

WordPress分页评论Ajax载入

觉得这篇文章有用吗?分享一下让更多人受益吧!

© 版权声明:本文章采用“姓名标示-非商业性-相同方式分享 4.0 国际(CC BY-NC-SA 4.0)”于“”发布,转载时须以相同方式发布并注明“原文链接”!

本文固定链接:https://www.arefly.com/zh-cn/wordpress-ajax-comment-pages/

本文章由“超级efly”于2014年10月13日发表于“WordPress”分类

你可以发表评论,并在保留原文地址及作者的情况下引用到你的网站

转载请注明:【纯代码】为WordPress添加AJAX无刷新之评论分页功能 | 畅想资源

关键字:, , ,

【纯代码】为WordPress添加AJAX无刷新之评论分页功能:目前有 95 条留言
访客以 55:40 大幅领先博主

评论载入中,请稍等……
  1. 44楼
    1111 Taiwan; Republic of China (ROC) Google Chrome Windows

    111

    [回复]
  2. 43楼
    黄小蚊 China Google Chrome Windows

    博主好强 这些都是wordpress经典的功能......

    [回复]
  3. 42楼
    yanyan China Google Chrome Windows

    真的可以吗?我试试

    [回复]
  4. 41楼
    你好 China Google Chrome Windows

    测试下,看看

    [回复]
  5. 40楼
    leejon China Google Chrome Windows

    测试ajax评论

    [回复]
  6. 39楼
    晓庄 China Google Chrome Windows

    分页倒是出来了。但有一个问题,点击回复,会刷新页面,时好时坏。
    博主能帮忙看下嘛

    [回复]
  7. 38楼
    晓庄 China Google Chrome Windows

    唉。没弄好。一直出不来。

    [回复]
  8. 37楼
    拽立网 China Google Chrome Windows

    谢谢博主分享好东西,我学习研究一下!

    [回复]
    • 感谢支持! :razz: :razz: :razz:

      [回复]
      • 拽立网 China Google Chrome Windows

        弄不好,点击下一页消失,全部消失了!错在哪里? :shock:

        [回复]
  9. 36楼
    chasonma China QQ浏览器 Windows

    路过,来看看! :mrgreen:

    [回复]
  10. 35楼
    亡月帝 China Google Chrome Windows

    错过了几篇文章~~~~

    [回复]
  11. 34楼
    我就有 China Google Chrome Windows

    谢谢分享,学习了,博主你的头像好给力啊 - -!

    [回复]
  12. 33楼
    料网 China Mozilla Firefox Windows

    博主,我今天尝试了一下。为什么点击页脚加载之后,评论列表重复出现了两次。。不知道这里能不能写链接,详见这里:http://www.liaosam.com/my-2014.html 。点击底部评论的 页码1 之后 好像页面加载的时候评论整个先后刷了两次(我注意的是右侧滚动条位置,第一次好像正常,第二次刷了以后导致出现两次评论列表。。)。

    [回复]
    • 你好~我之前也遇到过类似问题,个人感觉是因为JS中的DIV没有设置好,才导致这样重复显示~你看看JS中的元素都按自己的需要调整了么? :?: :?:

      [回复]
      • 料网 China 搜狗浏览器 Windows

        谢谢博主的快速回复!仔细检查了一遍,元素div和对象名称都是对的,现在怀疑可能是我用的另一个ajax提交评论的JS影响的。希望能顺利解决!

        [回复]
  13. 32楼
    协会主席 China Mozilla Firefox Windows

    翻页后头像加载不了了。。

    [回复]
    • :?: :?: 奇怪...我这里正常的啊?能不能F12看看是什么错误呢? :sorry: :sorry:

      [回复]
  14. 好像不兼容我主题

    [回复]
  15. 30楼
    大肥羊 China Mozilla Firefox Windows

    开了图片lazyload,翻页后头像就加载不进来了。。。。

    [回复]
    • :sorry: :sorry: 奇怪?我的网站么?我这里看起来没问题啊... :shock: :shock:

      [回复]
  16. 29楼
    大肥羊 China Mozilla Firefox Windows

    评论要翻页的文章不多,就不折腾了。

    [回复]
  17. 28楼
    凯凯 China Google Chrome Windows

    帅哥,我使用了不行啊,点击下一页只显示在加载中,列表不显示 :(

    [回复]
    • :sorry: :sorry: 很可能是因为你的主题评论DIV不同,自己拿F12看看修改对应代码就行了~ :mrgreen: :mrgreen:

      [回复]
  18. 27楼
    从良未遂 China Google Chrome Windows

    我的是主题自带的哎

    [回复]
  19. 26楼
    fendou China Mozilla Firefox Windows

    我想问下博主这个评论功能怎么弄呢 又有表情还可以插入链接

    [回复]

发表评论



微笑 调皮 偷笑 可爱 大笑 坏笑 诡计 赞 疑问 HI~ 爱 抱歉 对不起 头晕 惊讶 帅 努力 劳累 疯狂 难过 大哭 差 猪 邪恶 无言 愤怒 流汗 擦汗


快捷键:Ctrl+Enter