jQuery使整個div可在ajax內容上點擊

Question

我有一個Wordpress網站，帖子動態加載。 我已經將其添加到php文件中以發布單個帖子：

的HTML

<article>
    <div class="blog-item-holder">
        <div class="featured-image">
            <a href></a>
        </div> Conent
    </div>
</article>

JS

jQuery(document).ready(function() {
      $(".blog-item-holder").click(function(){
        window.location=$(this).find("a:first").attr("href"); 
        return false;
});
$(".blog-item-holder").css( "cursor", "pointer" );

但是在動態加載內容之后，接下來的帖子將沒有此腳本。 使用jQuery .on()是個好主意嗎？ 該代碼應如何工作？

Answer 1

使用on是一個好主意。 像這樣：

jQuery(document).ready(function() {

    $(document).on("click", ".blog-item-holder", function(){
        window.location=$(this).find("a:first").attr("href"); 
        return false;
    });

    $(".blog-item-holder").css( "cursor", "pointer" );

});

僅當window.location無法刷新頁面時，此方法才有效。

Answer 2

使用JQuery .on（）

$(".blog-item-holder").on("click", function(){
        window.location=$(this).find("a:first").attr("href"); 
        return false;
});