故事模式实现是只加载当前浏览的照片和它下面的两张照片,加载照片的时候才会加载和渲染评论区,图片没有加载前会用一个一象素的图片占位,并用一个loading类将显示出一个loading背景图,判断在可视区的时候替换成真正的图片,图片加载成功后删除loading类。
问题出在最后面,测试的时候发现在IE下loading类无法删除,当时代码如下:

网上找了一番,onload和定义src的语句应该换一下顺序,IE从缓存中取图片,onload根本不触发,opera也有这个毛病,正确代码修改如下

立即就正常了
结论:应该把onload写到src前面,先告诉浏览器图片加载完要怎么处理,再让它去加载图片。 所以,不是IE浏览器不会触发onload事件,而是因为加载缓冲区的速度太快,在没有告诉它加载完要怎么办时,它已经加载完了。反过来说,firefox明显更智能一些,加入onload事件后,firefox浏览器会检测缓冲区是否已经有此图片,有的话直接就触发此事件!
相关文章:
1. Flutter刷新组件RefreshIndicator自定义样式demo2. requestAnimationFrame使用示例详解3. 基于JavaScript实现图片裁剪功能4. vue深拷贝的3种实现方式小结5. 怎么让div+css兼容ie6ie7ie8ie9和FireFoxChrome等浏览器6. 详解JavaScript中原始数据类型Symbol的使用7. 深入理解JavaScript中的Base64编码字符串8. 使用uniapp打包微信小程序时主包和vendor.js过大解决(uniCloud的插件分包)9. 详解JS前端使用迭代器和生成器原理及示例10. JavaScript实现获取图片文件真实格式的示例代码