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);