功能适用于非动态加载的图像

Question

FIDDLE：https://jsfiddle.net/m2barfho/

嗨，我有以下功能：

var imgs = $('img'); 
    if ($(imgs).hasClass('cboxPhoto')) { 
    imgs.each(function() { 
     var img = $(this); 
     if ($(img).width() > 1000 && $(img).height() > 1000) { 
     img.addClass('relative'); 
     } 
     else { 
     img.removeClass('relative'); 
     } 
    }); 
    } 

我本质，指出如果<img>有类“cboxPhoto”的然后运行每个（ ）函数添加“相对”类，如果图像宽度大于x，则其高度大于x。当HTML已经是静态放置在此功能工作正常。但是，这些图像是动态生成的，我已经试过

$('#body').load('index.html #cboxLoadedContent', function() { 
} 

和

$(document).ready(function() {} with .`load` 

也尝试添加.on事件侦听器，即使我没有使用绑定事件来查看它可能检测到的加载时间。

问题： 图像是通过上传模块动态生成的，而不是静态放置的。由于某种原因，Colorbox不能运行我的功能。图像的类别为.cboxPhoto。我如何让我的hasClass函数检测动态生成的图像，并运行前面的each（）函数？它在我的小提琴中起作用，但不是我的索引？

Answer 1

您可以根据是否有cboxPhoto类来选择图像，然后遍历它们。

var imgs = $('img.cboxPhoto'); 
imgs.each(function() { 
    var img = $(this); 
    if (img.width() > 1000 && img.height() > 1000) { 
    img.addClass('relative'); 
    } else { 
    img.removeClass('relative'); 
    } 
}); 

Fiddle