资讯专栏INFORMATION COLUMN

两种方式javascript实现图片预览

mo0n1andin / 2218人阅读

摘要:方式一更适合页面,兼容,图片显示,主要功能点是和简洁代码如下方式二更适合端,兼容,主要功能点是简洁代码如下图片预览

方式一:更适合H5页面,兼容ie10+,图片base64显示,主要功能点是FileReader和readAsDataURL

简洁代码如下:




  
  files-h5


  
  
  


方式二:更适合PC端,兼容ie7+,主要功能点是window.URL.createObjectURL

简洁代码如下:




  
  files-pc


  
  
  

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/82113.html

相关文章

  • 两种方式javascript实现图片预览

    摘要:方式一更适合页面,兼容,图片显示,主要功能点是和简洁代码如下方式二更适合端,兼容,主要功能点是简洁代码如下图片预览 方式一:更适合H5页面,兼容ie10+,图片base64显示,主要功能点是FileReader和readAsDataURL 简洁代码如下: files-h5 function showPreview(source, imgId) ...

    Honwhy 评论0 收藏0
  • javascript实现图片伪异步上传

    摘要:使用监听的,一旦有发生,就表示服务器回传了信息增加上传文件类型限制思考这种方式对于单张图片上传没有问题,如果是多张,该怎样优化 实现逻辑 首先要知道, ajax无法发送带有文件的post请求所以,所以还是要用同步的方式,但是刷新的时候,我们不要在原来的页面刷新,去一个隐藏的iframe里面刷新,form表单中action正常填写处理文件上传的操作。紧着着的target填写一个隐藏的if...

    2i18ns 评论0 收藏0
  • javascript实现图片伪异步上传

    摘要:使用监听的,一旦有发生,就表示服务器回传了信息增加上传文件类型限制思考这种方式对于单张图片上传没有问题,如果是多张,该怎样优化 实现逻辑 首先要知道, ajax无法发送带有文件的post请求所以,所以还是要用同步的方式,但是刷新的时候,我们不要在原来的页面刷新,去一个隐藏的iframe里面刷新,form表单中action正常填写处理文件上传的操作。紧着着的target填写一个隐藏的if...

    mylxsw 评论0 收藏0
  • 少侠,留步,图片预览

    摘要:少年,我看你骨骼精奇,是万中无一的武学奇才,我这有本图片流秘籍,见与你有缘,就送于你了。文件大小,单位为字节,该属性只读。用来读取或文件数据,基于文件大小不同,读取的过程为异步。 showImg(https://segmentfault.com/img/remote/1460000016276887); 少年,我看你骨骼精奇,是万中无一的武学奇才,我这有本《图片流》秘籍,见与你有缘,就...

    岳光 评论0 收藏0
  • 少侠,留步,图片预览

    摘要:少年,我看你骨骼精奇,是万中无一的武学奇才,我这有本图片流秘籍,见与你有缘,就送于你了。文件大小,单位为字节,该属性只读。用来读取或文件数据,基于文件大小不同,读取的过程为异步。 showImg(https://segmentfault.com/img/remote/1460000016276887); 少年,我看你骨骼精奇,是万中无一的武学奇才,我这有本《图片流》秘籍,见与你有缘,就...

    elina 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<