Question

我一直在尝试创建AJAX类别过滤器，但是我无法使代码正常工作。我已遵循以下指示：http://juha.blog/dev/wordpress/ajax-filters-for-wordpress-categories/

修改：因此，我通过用jquery（this）替换$（this）来修复了脚本，但是现在，当我单击过滤器时，所有文章都消失了，并且当我单击（所有文章”时，它们再次显示。

所以在我的模板中：

<!-- Filters -->
<ul class="xiong-filters">
    <?php 
        $args= array(  
            'show_option_all'   =>   'All posts', //Text for button All
            'title_li'          => __('')
        );
    wp_list_categories( $args );
    ?>
</ul>

<!-- Loop -->
<?php if ( have_posts() ) :?>
<div id="main-content" class="row">
    <div id="inside">
        <div class="container">

            <?php while ( have_posts() ) : the_post(); ?>
                <article>
                    <a class="xiong-articlebox" href="<?php the_permalink();?>">
                        <header>
                            <h3><?php the_title( );?></h3>
                            <p><em><?php the_date( 'j.n.Y'); ?> </em></p>
                        </header>
                        <p><?php the_excerpt();?></p>
                    </a>
                </article>
            <?php endwhile; endif; ?>

        </div><!-- container-->  
    </div><!--inside -->                   
</div>  <!--row -->

在我的function.php中

//ENQUEUE SCRIPTS HERE
function xiong_theme_scripts() {
    //Ajax filter scripts     
    wp_register_script( 'ajax', get_template_directory_uri() . '/js/ajax.js', array( 'jquery' ), '1.0.0', true );
    wp_enqueue_script( 'ajax' );
    }
add_action( 'wp_enqueue_scripts', 'xiong_theme_scripts' );

在我的ajax.js中

//AJAX Filters

jQuery(function(){
    var mainContent = jQuery('#main-content'),
        cat_links = jQuery('ul.xiong-filters li a');

        cat_links.on('click', function(e){

            e.preventDefault();
            el = jquery(this);
            var value = el.attr("href");
            mainContent.animate({opacity:"0.5"});
            mainContent.load(value + " #inside", function(){
                mainContent.animate({opacity:"1"});
            });
            jQuery( "li" ).removeClass( "current-cat" );
            jQuery(this).closest('li').addClass("current-cat");
        });
});

我不知道如何修复它，因为我根本不了解js，所以非常感谢！

Ajax发布过滤器未给出结果

0 个答案: