AJAX是否在while循环中干扰if语句?

时间:2019-04-04 19:04:00

标签: javascript php ajax wordpress while-loop

我试图通过使用if语句在一定数量的帖子后调用它们,从而将我的边栏加载到while循环中。重要的是要注意,我正在使用AJAX代码(下面提供)加载滚动条中的帖子,我相信这可能是导致问题的原因。

尽管它们是侧边栏,但它们实际上并不是侧边栏,而是在帖子之间加载的内容。

我已经尝试了一周的时间来查找问题,但是我似乎无法在while循环中将侧边栏作为if语句加载AJAX。

重要注意事项:如果未通过AJAX加载,侧边栏将在帖子数之后加载。因此,如果是在初始加载中,则侧栏加载。但是当您继续滚动说第三或第四条时,它将不会加载,而AJAX将仅加载(parts/content)

我需要能够解析if语句,以便它可以在通过AJAX加载的while循环中工作,或者只要不删除AJAX,我也可以采用其他解决方案。

为了使此循环正常工作,已经进行了大量工作,非常感谢您的帮助!

front-page.php

 <?php
  $current_page = max( 1, get_query_var( 'paged' ) );
  $the_query = new WP_Query( array(
    'cat'            => '-21',
    'post_type'      => 'post',
    'posts_per_page' => 5,
    'paged'          => $current_page,
    'tax_query'      => array(
        array(
            'taxonomy' => 'topics',
            'operator' => 'NOT EXISTS',
            'field' => 'term_id',
            'terms' => $term_id
        )
    )
  ) );

  wp_localize_script( 'my_loadmore', 'misha_loadmore_params', array(
    'ajaxurl'      => admin_url( 'admin-ajax.php', 'relative' ),
    'posts'        => json_encode( $the_query->query_vars ),
    'current_page' => $current_page,
    'max_page'     => $the_query->max_num_pages
  ) );
?>

<div id="main" class="container-fluid">
    <?php if ($the_query->have_posts()) : ?>
      <?php $count = 0; ?>
      <?php while ($the_query->have_posts()) : $the_query->the_post(); get_template_part( 'parts/content', get_post_format() ); ?> <!-- This parts/content loads -->
      <?php $count++; ?>
 <!-- the dynamic_sidebar does not load -->
        <?php if ($count == 2 && is_active_sidebar('sidebar1') ) : ?>
          <div class="side-container first-side">

            <?php dynamic_sidebar('sidebar1'); ?>

          </div>

        <?php endif; ?>

        <?php if ($count == 10 && is_active_sidebar('sidebar2') ) : ?>
          <div class="side-container first-side">

            <?php dynamic_sidebar('sidebar2'); ?>

          </div>

        <?php endif; ?>

        <?php if ($count == 20 && is_active_sidebar('sidebar3') ) : ?>
          <div class="side-container third-side">

            <?php dynamic_sidebar('sidebar3'); ?>

          </div>
        <?php endif; ?>
      <?php endwhile; ?>
    <?php endif; ?>

  <?php wp_reset_postdata(); ?>

  <?php get_footer(); ?>
</div><!-- END CONTAINER -->

部件/内容-如果有帮助,它将按预期加载,包括代码

<div class="row post"> <!-- Post is mentioned in the below JS to load -->
    <div class="col-sm-5">
     <h2>Text</h2>
    </div>

    <div class="col-sm-7">
      <h3>text</h3>
    </div>
</div><!-- END ROW-->

侧边栏代码-最初加载时有效,但当AJAX调用此代码(例如front-page.php中的最后两个侧边栏)时不起作用

<?php
     $term = get_term_by( 'slug', get_query_var( 'term' ), get_query_var( 'taxonomy' ) ); ?>
    <?php while( $flexible_posts->have_posts() ) : $flexible_posts->the_post(); global $post; ?>
    <div class="sidebar-area">
        //sidebar code here
    } 
endwhile;
?>

myloadmore.js-AJAX呼叫

jQuery(function($){
    var canBeLoaded = true,
    bottomOffset = 2000; 

    $(window).scroll(function(){
        if ( misha_loadmore_params.current_page >= misha_loadmore_params.max_page ) {
            return;
        }
        var data = {
            'action': 'loadmore',
            'query': misha_loadmore_params.posts,
            'page' : misha_loadmore_params.current_page
        };
        if( $(document).scrollTop() > ( $(document).height() - bottomOffset ) && canBeLoaded == true ){
            $.ajax({
                url : misha_loadmore_params.ajaxurl,
                data: data,
                type: 'POST',
                beforeSend: function( xhr ){
                    // AJAX call is in process, we shouldn't run it again until complete
                    canBeLoaded = false;
                },
                success:function(data){
                    if( data ) {
                        $('#main').find('div.post:last-of-type').after( data ); // where to insert posts
                        canBeLoaded = true; // the ajax is completed, now we can run it again
                        misha_loadmore_params.current_page++;
                        bottomOffset = ( $( '#main > div.post:last' ).offset() || {} ).top
                    }
                }
            });
        }
    });
});

functions.php-为进一步的上下文而添加

function misha_my_load_more_scripts() {
    wp_register_script( 'my_loadmore', get_stylesheet_directory_uri() . '/js/myloadmore.js',
        array( 'jquery' ), '', true );
    wp_enqueue_script( 'my_loadmore' );
}
add_action( 'wp_enqueue_scripts', 'misha_my_load_more_scripts' );

function misha_loadmore_ajax_handler() {
    $args = json_decode( wp_unslash( $_POST['query'] ), true );
    $args['paged'] = $_POST['page'] + 1; // load the next page

    $the_query = new WP_Query( $args );

    if ( $the_query->have_posts() ) :
        while ( $the_query->have_posts() ) : $the_query->the_post();
            get_template_part( 'parts/content', get_post_format() );
        endwhile;
    endif;

    wp_die();
}
add_action( 'wp_ajax_loadmore', 'misha_loadmore_ajax_handler' );        // Authenticated users
add_action( 'wp_ajax_nopriv_loadmore', 'misha_loadmore_ajax_handler' ); // Non-authenticated users

1 个答案:

答案 0 :(得分:0)

这里的技巧是在AJAX处理程序中也添加if语句。也许有AJAX经验的人可以补充这一天来解释它为什么起作用,但是我所知道的是它确实起作用。我的问题中的所有代码都相同,以下是与functions.php ajax处理函数的区别。

function misha_loadmore_ajax_handler() {
    $args = json_decode( wp_unslash( $_POST['query'] ), true );
    $args['paged'] = $_POST['page'] + 1; // load the next page

    $the_query = new WP_Query( $args );

    if ( $the_query->have_posts() ) :
        while ( $the_query->have_posts() ) : $the_query->the_post();
            get_template_part( 'parts/content', get_post_format() );

    <?php if ($count == 2 && is_active_sidebar('sidebar1') ) : ?>
      <div class="side-container first-side">
        <?php dynamic_sidebar('sidebar1'); ?>
      </div>
    <?php endif; ?>

    <?php if ($count == 10 && is_active_sidebar('sidebar2') ) : ?>
      <div class="side-container first-side">
        <?php dynamic_sidebar('sidebar2'); ?>
      </div>
    <?php endif; ?>

    <?php if ($count == 20 && is_active_sidebar('sidebar3') ) : ?>
      <div class="side-container third-side">
        <?php dynamic_sidebar('sidebar3'); ?>
      </div>
    <?php endif;
        endwhile;
    endif;
    wp_die();
}