`
逆风的香1314
  • 浏览: 1388071 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

图片上传时,本地显示预览功能

阅读更多
问的人很多,我就把最简单给大家。

  1. <script type="text/javascript">
  2. function showImg(){
  3.   document.getElementById("IMG").src=document.getElementById("photo").value;
  4. }
  5. </script>
  6. <img src="" id="IMG" />
  7. <input type="file" name="photo" id="photo" size="30" onchange="showImg()" />
还有许多细节,大家自己完善吧。
分享到:
评论

相关推荐

    图片上传及预览+时间水印

    快速实现图片上传及预览+时间水印功能;可设置图片像素,大小,张数,时间水印; 一句代码即可实现,easy,easy,easy

    基于jquery实现图片上传本地预览功能

    当我们在上传文件时如果每次都要上传到服务器才可以预览这个做看上合理其实是不合理的,如果网速慢或图片有问题,这样不但浪费客户时间同时也浪费服务器资源了,下面我们介绍利用js上传图片时本地实现预览,希望此...

    input-file的本地图片预览+等比例缩放

    在对象容器边界内,在对象的背景和内容之间显示一张图片。并提供对此图片的剪切和改变尺寸的操作。如果载入的是PNG(Portable Network Graphics)格式,则0%-100%的透明度也被提供。

    图片上传、预览、水印、剪裁

    类似于各大网站上的会员头像...4.当用户点击保存时,将图片上传至服务器,同时将缩放比例或者缩放后图片的大小传给后台,并且将选取框的大小和坐标也传给后台。 5.在后台使用ImageIO对图片进行缩放,缩放后再裁减。

    extjs中本地照片预览、blob数据在oracle中存取

    此压缩包中完全能实现的功能是在extjs中让本地照片预览,并且将地址传递给java后台,将图片文件以blob的形式存储到oracle数据库,并且可以默认将数据库中的数据第一次加载在预览框里(也就是从数据库中读出blob数据...

    JavaScript实现图片本地预览功能【不用上传至服务器】

    本文实例讲述了JavaScript实现图片本地预览功能。分享给大家供大家参考,具体如下: 实现一个在file文件域中选定图片文件之后,马上进行预览。不用预上传到服务器,整缩略图再打回前端用Ajax去预览的。直接利用...

    绝对好用!extjs中本地照片预览、blob数据在oracle中存取.zip

    此压缩包中完全能实现的功能是在extjs中让本地照片预览,并且将地址传递给java后台,将图片文件以blob的形式存储到oracle数据库,并且可以默认将数据库中的数据第一次加载在预览框里(也就是从数据库中读出blob数据...

    JS中利用FileReader实现上传图片前本地预览功能

    平时做图片上传预览时如果没有特殊的要求就直接先把图片传到后台去,成功之后拿到URL再渲染到页面上,这样做在图片比较小的时候没什么问题,大一点的话就会比较慢才能看到预览了,而且还产生了垃圾文件,所以比较好...

    Javascript图片上传前的本地预览实例

    图片的上传预览功能主要用于图片上传前的一个效果的预览,目前主流的方法主要有js,jquery与flash实现,但我们一般都会使用js来实现图片上传预览功能,下面来看一个例子。 原理: 分为两步:当上传图片的input被触发...

    图片预览上传.html

    图片在上传之前先进行本地预览功能,显示为一个缩略图,再进行上传

    H5上传本地图片并预览功能

    最近工作中需要H5上传显示图片的功能,如图: 直接上代码: html部分 &lt;div class=figure-box id=figure_box&gt;&lt;/div&gt; &lt;input type=file id=imgUploadBtn /&gt; &lt;a&gt;&lt;i&gt;添加作品&lt;/a&gt;&lt;/div&gt; 我这边用css将...

    图片上传预览js,可代替flash上传功能

    无需上传显示本地选择的图片,可用作头像更换等,完美兼容IE6,7,8,谷歌;IE9,IE10 未测

    Ext相册实现文件拖拽,实时上传进度,本地预览(2012-05-14版)

    修复上传进度显示BUG 增加相片右键菜单 上传更改为上传全部项和上传选中项 增加图片浏览器功能 图片浏览器支持拖动、双击最大化/还原、更改尺寸 图片浏览器支持对数据源里面的图片进行导航 图片浏览器图片的放大和...

    修改版完整版wangEditor

    修改版完整版wangEditor

    新浪在线编辑器完美JSP版,支持本地图片上传功能

    新浪htmlteditor在线编辑器完美JSP版 支持全中文名称,由smartupload组件上传文件,可完美上传预览图片。放在根目录下可以直接运行。支持按年月自动创建上传目录,支持缩略图显示。 运行环境TOMCAT1.6下通过。 ...

    jsp中点击图片弹出文件上传界面及实现预览实例详解

    花了两天时间琢磨一下图片预览的功能 任务需求如下: 1:jsp页面中有一个图片(pic_1) 2:点击图片弹出类似于资源管理器的界面 3:选择完某一个图片之后在pic_1处预览 我在IE8上试验下面这段代码,可以实现上述...

    Vue+Vant 图片上传加显示的案例

    前端开发想省时间就是要找框架呀!找框架! vant中上传图片组件:https://youzan.github.io/vant/#/zh-CN/uploader 上传图片的组件uploader: *&gt; method中 methods: { //选择图片后执行 onRead(fi

    js实现图片上传预览原理分析

    目前网上有很多支持图片上传时进行预览的插件,功能完备,界面优雅,使用起来也很方便。一直以来也就只是用用,没有想过这些插件背后的实现原理。趁着今天有点时间,也来学习学习。 追根溯源 设想 一开始,按照我的...

    MY动力 Ver 3.51 Build 正式版.rar

    4、后台具有便捷的图片上传的显示与管理,可添加多个图片查看地址。 5、对图片可发表评论,管理员可设定发表评论的权限及进行管理与回复功能。 6、图片显示时具有放大、缩小、全屏显示、实际大小、最适合大小显示...

Global site tag (gtag.js) - Google Analytics