javascript - 使用jQuery设置高度

我正在检查卡片包装器是否具有列表视图类。如果是的话，那么我得到了泥工div的当前高度，当用户单击“加载更多”按钮时，我将当前高度加100px并将其设置为泥工。

但是问题是当我单击.load-more按钮setListHeight函数未调用时

请告诉我我做错了什么？

if ($(".cards-wrapper").hasClass("list-view")) {
    $('.load-more').on('click',setListMoreHeight);
}

function setListMoreHeight(){
    alert('called');
    var currentHeight = $('.mason').height() + 100;
    console.log(currentHeight);

    $('.mason').height(currentHeight);
    console.log(currentHeight);

}

最佳答案

您的if语句仅被评估一次。如果为false，则不会绑定click事件，并且永远不会再次评估if语句。

我会做更多这样的事情：

$('.load-more').on('click', function() {
    if ($(".cards-wrapper").hasClass("list-view")) {
        setListMoreHeight();
    }
})

function setListMoreHeight(){
    alert('called');
    var currentHeight = $('.mason').height() + 100;
    console.log(currentHeight);

    $('.mason').height(currentHeight);
    console.log(currentHeight);

}

现在，单击事件始终有效，而不是有条件地绑定click事件。我们仅在满足条件的情况下调用该函数。