首頁  >  問答  >  主體

js在读取大图片的过程中,怎么先显示另一张图片?

问题描述:现在正在做一个视频的预览功能,上传一个视频到服务器后,服务器会先调用第三方工具进行解析,然后得到一张该视频中某个帧的截图(该截图很小,不用考虑加载这个图片的时间);现在用户上传了一个视频,我需要在页面中显示这个截图,但是服务器还在解析视频,所以我得不到这个截图,这时候,界面上会显示一个破损的图片,体验很差,我希望它能够先显示一个图片(一个已经准备好的体积很小的图片),直到服务器解析完成得到该截图后再显示截图内容;

已经尝试的方法:编程语言是Java,用它的timer先设置该位置的图片为已有的图片,在一段时间后比如10s后,再从服务器中去加载视频的截图,这个时候有一个问题,我确实能得到服务器解析后的图片,但是js已经把原来的图片给显示了出来,我得到了新的url,但是没有办法刷新页面来使得图片得到更新,系统的前端是用Google的gwt写的,改起来很吃力;希望能用图片标签的某个属性来完成;

寻求帮助,谢谢各位的解答!


高洛峰高洛峰2937 天前522

全部回覆(1)我來回復

  • 三叔

    三叔2016-10-28 13:19:14

    这个就是一种写法,你把img的src改成你想请求的那个小图片。然后你给img的上面加一个data-src。这个地址就是你真正的地址。你给window.load事件上。用延时器settimeout做一个10秒后吧data-src放入src中。当然。也有一些图片懒加载的插件。感兴趣可以上网查

    回覆
    0
  • 取消回覆