Question

所以这是我的php模板，我试图启用无限滚动（http://wptheming.com/2012/03/infinite-scroll-to-wordpress-theme/）

 <?php 
 /* Template Name: Front page */ 
 get_header(); 
 ?>     
 <div class="rfp_hide" id="rhm_posts_show">
    <?php
    if ( get_query_var('paged') ) {
        $paged = get_query_var('paged');
    } elseif ( get_query_var('page') ) {
        $paged = get_query_var('page');
    } else {
        $paged = 1;
    }       
    $args = array( 
        'post_type' => 'posts',
        'paged'=>$paged,
        'posts_per_page' => 5,
        'posts_cat' => '',
        'orderby' => 'date',            
        'order' => 'DESC'
        );
    $loop = new WP_Query( $args );
    global $post, $paged; 
    while ( $loop->have_posts() ) : $loop->the_post(); 
    ?>  
    <div class="rhm_posts_container">
        Contents goes here
    </div>          
    <?php endwhile; ?>
    <?php wp_reset_postdata(); ?>   
    <nav id="rh_nav_below">
        <ul>
            <li class="rh_nav_previous"><?php previous_posts_link( '&laquo; PREV', $loop->max_num_pages) ?></li> 
            <li class="rh_nav_next"><?php next_posts_link( 'NEXT &raquo;', $loop->max_num_pages) ?></li>
        </ul>
     </nav>
    </div>  
 </main><!--/main content -->
 <?php get_footer(); ?>

这是我的functions.php：

//Infinite scroll 
function custom_infinite_scroll_js() {
{ ?>
<script>
var infinite_scroll = {
    loading: {
        img: "<?php echo get_template_directory_uri(); ?>/img/ajax-loader.gif",
        msgText: "<?php _e( 'Loading the next set of posts...', 'custom' ); ?>",
        finishedMsg: "<?php _e( 'All posts loaded.', 'custom' ); ?>"
    },
    "navSelector":"#rh_nav_below",
    "nextSelector":"#rh_nav_below .rh_nav_next a",          
    "contentSelector":"#rhm_posts_show",
    "itemSelector":".rhm_posts_container"   
 };
  jQuery( infinite_scroll.contentSelector ).infinitescroll( infinite_scroll );
 </script>
   <?php
 }
 }
  add_action( 'wp_footer', 'custom_infinite_scroll_js',100 );

  //add infinite scroll js
  function custom_theme_js(){
    wp_register_script( 'infinite_scroll',  get_template_directory_uri() . '/js/jquery.infinitescroll.min.js', array('jquery'),null,false );
    wp_enqueue_script('infinite_scroll');

  }
  add_action('wp_enqueue_scripts', 'custom_theme_js');

有人可以帮忙，为什么它不起作用？我有正确的选择器吗？

谢谢！

Answer 1

基本上这里出现的问题是你在不理解底层代码的情况下复制粘贴。

在您添加到PHP的JS片段中，您将添加无限滚动应该起作用的元素（contentSelector）

在示例中，这被设置为＆＃34; #content＆＃34;，但在您的代码中它应该是＆＃34; .pagination＆＃34;。

因此，如果您更改contentSelector，它应该可以工作：）

编辑：我建议您在＆＃34;之前更改＆＃34;在你的php中id =＆＃34;分页＆＃34;。这可能会破坏您的模板，因此请务必使用不同的页面对其进行测试，但这样您就可以选择id而不是更可靠，更快的类

已经回答了。 infinite scroll enabling (wordpress)

无限滚动建议

1 个答案: