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