C 知道

消息
创作中心
The-dreams 2022-02-12 09:57 采纳率: 50%
浏览 54
已结题

如何让js等一个img标签中的图片加载完再执行

现在遇到一个问题
img标签中的图片加载，渲染需要时间
js需要等到图片加载完再执行

  • 写回答

6条回答 默认 最新

  • CSDN专家-showbo 2022-02-12 12:28
    关注

    给img添加onload事件，加载完毕就会执行onload中的代码

    <meta name="referrer" content="no-referrer">
<img src="https://avatar.csdnimg.cn/4/0/B/4_weixin_47996780_1619001731.jpg" onload="alert('loaded')"/>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
    The-dreams 2022-02-12 12:39

    感谢

    赞
    回复
查看更多回答(5条)
编辑
预览

报告相同问题？

  • 图片img的src不变让浏览器重新加载实现方法
    2020-12-08 19:07
    在网页开发中，图片加载是常见的操作，但有时由于浏览器的缓存机制，即使图片的URL没有改变，浏览器也会从本地缓存中加载图片，而不是重新从服务器获取。这可能导致我们无法看到图片的最新版本，特别是在进行动态...
  • js实现图片在未加载完成前显示加载中字样
    2020-10-25 03:59
    本例中，通过编写一系列JavaScript函数和事件监听，解决了一个常见的前端开发问题：如何在图片加载完成之前给用户显示加载中的状态，以及如何处理图片加载失败的情况。通过代码的逻辑处理，能够在不同类型的浏览器中...
  • js前端实现图片懒加载(lazyload)的两种方式
    2020-12-01 04:55
    - Echo.js是一个轻量级的、独立于jQuery的图片延迟加载库，非常适合不依赖jQuery的项目。其核心思想与jQuery Lazyload类似，但更简洁。 - 在HTML中，同样使用`data-src`代替`src`属性： ```html <img class=...
  • img 加载网络图片失败 显示默认图片的方法
    2020-08-30 03:02
    在 Web 开发中，加载网络图片失败是常见的问题之一。当从网络加载图片失败时，我们希望显示默认图片，以便提供更好的用户体验。今天，我们将讨论如何在 img 标签中显示默认图片的方法。 概述 当从网络加载图片失败...
  • Javascript实现图片加载从模糊到清晰显示的方法
    2020-10-21 18:20
    在传统的加载方式中，一种是直接在HTML页面中使用img标签加载图片，但这种方式在网络条件不佳的情况下，会导致页面空白或者图片加载缓慢，用户体验差。另一种是先加载图片的缩略图，再加载原图。这种方法虽然可以...
  • 【Webpack 踩坑】img 标签图片加载不出来
    2024-07-30 08:29
    ①条咸鱼的博客 ，抱着试一下的态度加上去，没想到还真有用）标签路径解析错误，导致加载不出来。写原生代码，一下子踩了好多坑…不管怎么改控制台都显示下面的。一直用框架开发，好久没用过。文件成功加载了，以为不用。
  • js处理img标签加载图片失败，显示默认图片
    2018-11-02 08:45
    CodingSir的博客 1.第一种方法：  如果已经引入了jquery插件，就很好办。没有的话，如果实在需要，可以附上代码：  script(type='text/javascript', src="...
  • vue项目中 img标签加载图片失败，让其显示默认图片
    2022-07-05 02:55
    我是一个小扒菜的博客 vue项目中 img标签加载图片失败，让其显示默认图片
  • javascript图片预加载完整实例
    2020-10-22 20:27
    JavaScript图片预加载可以分为不同的方式，其中最常见的是使用JavaScript来创建一个Image对象，并将其src属性设置为要加载的图片地址，这种方式可以异步地下载图片而不会影响页面其他元素的加载。 在上述给出的实例...
  • img标签图片未加载完成占位图
    2024-04-17 10:01
    璐哈路哈呦的博客 通过Css控制，实现加载接口下发或者网络图片时，未加载完成前，先加载本地一张占位图，记载完成显示接口下发的图或者网络图。实现方式：通过在img标签的after伪元素上添加一张占位图，并且img标签都设置为。如果需要...
  • 没有解决我的问题, 去提问

问题事件

  • 系统已结题 2月19日
  • 已采纳回答 2月12日
  • 创建了问题 2月12日
手机看
程序员都在用的中文IT技术交流社区

程序员都在用的中文IT技术交流社区

专业的中文 IT 技术社区，与千万技术人共成长

专业的中文 IT 技术社区，与千万技术人共成长

关注【CSDN】视频号，行业资讯、技术分享精彩不断，直播好礼送不停！

关注【CSDN】视频号，行业资讯、技术分享精彩不断，直播好礼送不停！

 客服 返回
顶部