使用 ajax 关闭 Magnific 弹出内容后，所有 owl Carousel 都会中断

Posted 2023-05-07

【中文标题】使用 ajax 关闭 Magnific 弹出内容后，所有 owl Carousel 都会中断

【英文标题】：All owl Carousel breaks after closing the Magnific popup content using ajax

【发布时间】：2015-03-30 23:41:09

【问题描述】：

我正在创建一个单页 WP 主题，实际上主题是由其他人创建的，我正在将其转换为 WP。一切正常，但是当查看并关闭博客部分的帖子时，网站上的所有轮播都会中断。帖子在放大的弹出窗口中打开。

// 链接<a href="<?php the_permalink(); ?>" class="ajax-popup-link"></a>

// 壮丽的$('.ajax-popup-link').magnificPopup( type: 'ajax', closeOnBgClick: false );

// 使用弹出窗口的完整代码

    <?php
    $bl_args = array(
        'post_type' => 'post',
        'orderby' => 'date',
        'order' => 'DEC',
    );
          $counter = 0;
    $bl_query = new WP_Query( $bl_args );
    // The Loop
    if ( $bl_query->have_posts() ) 
        while ( $bl_query->have_posts() ) 
            $bl_query->the_post();


                            if( $counter%4 == 0 ) 

                                echo '<div class="blog">';
                                echo '<div class="row">';
                             //open before every fourth item

                            echo '<div class="col-md-6">';
                     ?>
    <a href="<?php the_permalink(); ?>" class="ajax-popup-link">
                     <?php
                            the_post_thumbnail('blog-thumb');
                     ?>
                            </a>
                     <?php
                            echo '<div class="row">';
                            echo '<div class="col-sm-2"><span><span>';
                            the_time('j');
                            echo '</span>';
                            the_time('F Y');
                            echo '</span>';
                            echo '</div><!-- .col-sm-2 -->';
                            echo '<div class="col-sm-10">';
                            echo '<h4>';
                    ?>
    <a href="<?php the_permalink(); ?>" class="ajax-popup-link">
                    <?php
                            echo get_the_title();
                    ?>
    </a>
                    <?php
                            echo '</h4>';
                            the_excerpt();
                            echo '</div><!-- .col-sm-10 -->';
                            echo '</div><!-- .row -->';
                            echo '</div><!-- .col-md-6 -->';

                            if( $counter%4 == 3 )  
                                echo '</div><!-- .row -->'; 
                                echo '</div><!-- .blog -->';
                             //close after each block of four or after last item
                            $counter++;
        
    

    /* Restore original Post Data */
    wp_reset_postdata();
          ?>

谢谢！

【参考方案1】：

问题是因为弹出，样式和脚本再次加载。我删除了wp_head() 和wp_footer()，现在一切正常。