我的日常

登录/注册
您现在的位置:论坛 资料库 前端开发 > js如何加载完图片再做其他操作
总共48087条微博

动态微博

查看: 2621|回复: 2

js如何加载完图片再做其他操作

[复制链接]
admin    

1244

主题

544

听众

1万

金钱

管理员

  • TA的每日心情

    2021-2-2 11:21
  • 签到天数: 36 天

    [LV.5]常住居民I

    管理员

    跳转到指定楼层
    楼主
    发表于 2014-06-03 20:02:21 |只看该作者 |倒序浏览
         最近项目中遇到了一个问题:用户点击一个链接之后出现页面要判断图片的高度、根据高度判断展示部分还是全部、但是大的图片在没加载完成后就做判断导致不准确、不能出现所要的效果。
        这个是一个AJAX请求,请求过来的是图片的url,javaScript需要在图片加载完成之后才会获得图片的大小信息的,所以,修改图片大小操作的函数需要在图片加载完成之后才能执行,否则就会出现获取不到图片长宽信息出现错误的现象。
        最开始的时候,我想到的方法是使用setTimeOut,在执行修改图片大小的函数之前等500ms,这样可以保证图片加载进来,但是这样的方法如果遇到网速很慢的情况的时候还是会出现获取不到图片的信息现象,而且就算网速正常,500ms的等待我们肉眼也能感觉得到那图片的位置和大小在变化。
        后来,发现JavaScript的onload()可以完成这个任务,onload事件是当一个页面或是一张图片加载完成时被触发的。所以,在请求的img标签里面添加一个onload事件:
       
    1. <img src="url" onload="imgOnload()" />
    复制代码


        其中imgOnload()是对图片进行修改大小的函数,这样我的问题就解决了。


    科帮网 1、本主题所有言论和图片纯属会员个人意见,与本社区立场无关
    2、本站所有主题由该帖子作者发表,该帖子作者与科帮网享有帖子相关版权
    3、其他单位或个人使用、转载或引用本文时必须同时征得该帖子作者和科帮网的同意
    4、帖子作者须承担一切因本文发表而直接或间接导致的民事或刑事法律责任
    5、本帖部分内容转载自其它媒体,但并不代表本站赞同其观点和对其真实性负责
    6、如本帖侵犯到任何版权问题,请立即告知本站,本站将及时予与删除并致以最深的歉意
    7、科帮网管理员和版主有权不事先通知发贴者而删除本文


    JAVA爱好者①群:JAVA爱好者① JAVA爱好者②群:JAVA爱好者② JAVA爱好者③ : JAVA爱好者③

    admin    

    1244

    主题

    544

    听众

    1万

    金钱

    管理员

  • TA的每日心情

    2021-2-2 11:21
  • 签到天数: 36 天

    [LV.5]常住居民I

    管理员

    沙发
    发表于 2014-06-03 20:03:16 |只看该作者
    以上 方法借鉴了某位朋友的 方法 感觉不错 项目正常运行
    回复

    使用道具 举报

    1

    主题

    0

    听众

    117

    金钱

    三袋弟子

    该用户从未签到

    板凳
    发表于 2016-11-18 16:52:28 |只看该作者
    受教了!这个论坛果然很不错,适合学习
    回复

    使用道具 举报

    快速回复
    您需要登录后才可以回帖 登录 | 立即注册

       

    关闭

    站长推荐上一条 /1 下一条

    发布主题 快速回复 返回列表 联系我们 官方QQ群 科帮网手机客户端
    快速回复 返回顶部 返回列表