当包含div的所有元素都已完全加载时,我可以将事件分配给div来触发吗？例如.如果div包含图像,则在图像完全加载时在div上触发事件.我正在使用
jquery.
解决方法
不确定您是如何动态添加内容的,但此示例应说明它是如何工作的.
它使用.append()来模拟动态加载的内容.然后在追加之后,它使用.find()来查找图像,并使用.load()来为它们附加一个加载处理程序.
最后,它返回图像的长度属性.然后在加载处理程序中,当图像完成加载时,长度递减.一旦它变为0,所有图像都被加载,并且if()内的代码运行.
var len = $('#mydiv').append('<img src = "http://dummyimage.com/150x90/f00/fff.png&text=my+image" /><img src = "http://dummyimage.com/160x90/f00/fff.png&text=my+image" /><img src = "http://dummyimage.com/170x90/f00/fff.png&text=my+image" /><img src = "http://dummyimage.com/180x90/f00/fff.png&text=my+image" />')
.find('img')
.load(function() {
if( --len === 0) {
alert('all are loaded');
}
}).length;
这样,代码仅基于#mydiv中的图像运行.
如果那里的任何图像不是动态的,因此不应该得到.load()事件,你应该能够添加一个.not()过滤器来排除complete属性为true.
将它放在.find()之后和.load()之前.
.not(function(){return this.complete})
