jQuery不适用于无限滚动

Question

我刚刚制作了一个新的wordpress主题，并且正在使用以下脚本来获得类似手风琴的效果。

( function( $ ) {
    var $ele = $('.entry-content').hide(); 
    $(".entry-header").click(function(e) { 
        e.preventDefault();
        var $ele1 = $(this).parents(".post").children('.entry-content').slideToggle('fast');
        $ele.not($ele1).slideUp(); 
    });
} )( jQuery );

我刚刚激活了jetpack的无限滚动 。 jQuery脚本不适用于无限滚动添加的新加载内容。 我的猜测是，每当无限滚动添加新内容时，都必须重新加载或至少触发脚本。 我整天都在网上搜索，找不到任何解决方案。 在这里的任何帮助，将不胜感激。

我已经将.js放入我的functions.php中，如下所示：

function journial() {
    wp_enqueue_script( 'journial', get_template_directory_uri() . '/js/journial.js', array( 'jquery' ), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'journial' );

Answer 1

附加帖子后，您需要触发一个事件。 要利用此事件，只需在document.body上触发后捕获后加载事件即可：

 (function($){ //wait until dom has loaded function initAccordion(){ // first, prepare your function var $ele = $('.entry-content').hide(); $(".entry-header").unbind('click').click(function(e) { // bind click event handler e.preventDefault(); var $ele1 = $(this).parents(".post").children('.entry-content').slideToggle('fast'); $ele.not($ele1).slideUp(); }); } initAccordion(); // second, run the function the first time page loads $(document.body).on('post-load', function(){// third, setup event handeler initAccordion(); //run the funtion again after new content is loaded }); } )(jQuery);