首页 文章

Wordpress ajax分页评论

提问于
浏览 次
1

我在数据库中调用我的Wordpress注释并使用自定义查询显示它们，然后使用Wordpress的 paginate_links() 函数对我的注释进行分页 . 我的代码：

<div class="commentsWrap">
<div id="comments" class="commentBoxesWrap">
    <?php
    global $wpdb;
     $querystr = " SELECT comment_content, commentmeta1.meta_value 
     AS comment_name, commentmeta2.meta_value 
     AS comment_country 
     FROM $wpdb->comments, $wpdb->commentmeta 
     AS commentmeta1, $wpdb->commentmeta 
     AS commentmeta2 
     WHERE $wpdb->comments.comment_ID = commentmeta1.comment_id 
     AND $wpdb->comments.comment_ID = commentmeta2.comment_id 
     AND commentmeta1.meta_key = 'comment_name' 
     AND commentmeta2.meta_key = 'comment_country' 
     AND $wpdb->comments.comment_approved = 1 ";

     $total_query = "SELECT COUNT(1) FROM (${querystr}) AS combined_table";
     $total = $wpdb->get_var( $total_query );
     $items_per_page = 4;
     $page = isset( $_GET['paged'] ) ? abs( (int) $_GET['paged'] ) : 1;
     $offset = ( $page * $items_per_page ) - $items_per_page;
     $comment_info =  $wpdb->get_results($querystr .  "ORDER BY $wpdb->comments.comment_date DESC LIMIT ${offset}, $items_per_page");

    echo '<ul class="commentsList">';
    // display the results
    foreach($comment_info as $info) { 
          echo '<li class="commentBox"><p>"' . $info->comment_content . '"</p><h6>' . $info->comment_name . ', ' . $info->comment_country . '</h6></li>'; 
    }
     echo '</ul>';
    ?>

     </div>  <!-- //commentBoxesWrap -->
     <?php
     echo '<div class="commentPagination">';
     echo paginate_links( array(
        'base' => add_query_arg( 'paged', '%#%' ),
        'format' => '',
        'prev_text' => __('&laquo;'),
        'next_text' => __('&raquo;'),
        'total' => ceil($total / $items_per_page),
        'current' => $page
    ));
    echo '</div>';
    ?>
    </div>  <!-- //commentsWrap -->

这工作正常并输出编号分页，但是，当我单击分页时，我需要ajax注释 . 通过一些研究，我设法提出了这个js代码：

$('.commentsWrap').on('click', '.commentPagination a', function(event) {
     event.preventDefault();
     var link = $(this).attr('href');
     $('.commentsWrap').load(link + '.commentsWrap');
});

这样做虽然是通过ajax而不是评论部分加载整个页面！有人可以帮我吗？

谢谢 .

php jquery ajax wordpress

2 回答

  • 0

    试试这个评论的分页 . 我已经使用了jquery . 您需要更改ajax页面网址和加载程序图像源的网址 . 尝试在下面添加以下代码 . 此代码仅在您的分页正确且有效时才有效 .

    <div class="loadmorediv">

        <button id="loadmorebutton" style="padding:15px 25px;">More</button>

        <button id="no_morebutton" style="padding:15px 25px;">No more</button>

        </div> <!-- //commentsWrap -->


        <div class="row" style="text-align:center; ">

        <a id="inifiniteLoader"><img src="imagesoruce" /></a>

            <div style="clear:both"></div>

        </div> 

 <script type="text/javascript">

        var count = 2;

        var total = <?php ceil($total / $items_per_page)  ?>;


        jQuery(function($) {

            $('#loadmorebutton').click(function() {


                     if (count > total){

                 $('#loadmorebutton').hide();

                    $('#no_morebutton').show();

                return false;

                }else{

                        $('#loadmorebutton').hide();

                     $('a#inifiniteLoader').show();

                    loadArticle(count);

                 }

                 count++;



            })

        });

        function loadArticle(pageNumber){    

               jQuery.ajax({

                     url: "Yourpageurl"+pageNumber+"/",

                    type:'POST',                      

                    success: function(html){
                   result=    jQuery(html);

                        jQuery('a#inifiniteLoader').hide('1000');

                        jQuery('#loadmorebutton').show('1000');

                     jQuery("ul.commentsList").append(result.find("ul.commentsList").html());   // This will be the div where our content will 
                    }
                });

            return false;
                  }

    </script>
    回复于
  • 0

    你在选择器之前缺少一个空格 . 这必须是：

    $('.commentsWrap').load(link + ' .commentsWrap');
    回复于

相关问题