手机版

jQuery实现图片上传前预览效果

时间:2021-09-04 来源:互联网 编辑:宝哥软件园 浏览:

网上很多代码都实现了上传图片的功能,但是不支持图片的实时预览。以下功能实现了上传图片前的预览效果,如下。

效果如下:

代码如下:

!doctype html heartheta charset=' utf-8 ' title jquery可以在上传图片前预览效果/title script src=' http :http://libs . Baidu.com/jquery/1 . 11 . 3/jquery . min . js '/script style/style/headsdyinputtid=' file ';=' onchange=' c()' type=' file ' brimg src=' http : ' id=' show ' width=' 200 ' script function c(){ var r=new FileReader();f=document . getelementbyid(' file ')。文件[0];r . ReadAsDataURl(f);r . onload=function(e){ document . getelementbyid(' show ')。src=this.result};}/脚本/正文/html以上就是本文的全部内容。希望对大家的学习有帮助,支持我们。

版权声明:jQuery实现图片上传前预览效果是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。