javascript - jQuery - 刷新 each() 函数

Question

我对这段代码有疑问：

$('#portfolio-filter a').click(function(){
    //Some conditions here to add my class 'thumbnail-view' to some div
   $('#portfolio-list').find('.project').addClass('thumbnail-view');
});

$(".thumbnail-view").each(function(j){
     $(this).click(function(){      
        alert(j);
     });
});

每次单击 div id 投资组合过滤器中的链接时，我都会在特定元素上添加类缩略图视图。当我加载页面时，我的每个功能都可以正常工作，但是由于第一个功能，它没有考虑到变化。每次单击 #portfolio-filter 中的链接时是否需要刷新每个功能？我怎样才能做到这一点 ？谢谢 ！

Answer 1

您可以使用事件委托，然后使用index代替您的j：

$(document).on("click", ".thumbnail-view", function() {
    alert($(".thumbnail-view").index(this));
});

例子

Answer 2

如果要重新计算j索引，一个解决方案是在添加类时重做绑定。

$('#portfolio-filter a').click(function(){
    //Some conditions here to ass my class 'thumbnail-view' to some div
    $('#portfolio-list').find('.project').addClass('thumbnail-view');
    $(".thumbnail-view").off('click').each(function(j){
         $(this).on('click', function(){      
            alert(j);
         });
    });
});

另一种解决方案是在on每次单击元素时使用并计算索引（通过遍历所有元素并与 比较this）。

Answer 3

$(".thumbnail-view").on("click",function(){      
       alert(j);
});