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的infinite scroll。 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);