js实现上传图片立即回显

女爷i 2022-09-30 10:59 379阅读 0赞

<script type="text/javascript"> //门头照片 function newFile() { var windowURL = window.URL || window.webkitURL; var loadImg = windowURL.createObjectURL(document.getElementById('photoPic').files[0]); document.getElementById('newImg').setAttribute('src',loadImg); } //营业执照复印件 function oldFile() { var windowURL = window.URL || window.webkitURL; var loadImg = windowURL.createObjectURL(document.getElementById('licensePic').files[0]); document.getElementById('oldImg').setAttribute('src',loadImg); } </script>

<div class='form-div'>
                        <label class="form-label">门头照片<b>*</b></label>
                        <div class="up-pic">
                            <img src="" id="newImg" > 
                            <span>+</span>
                            <input type="file" id="photoPic" onchange="newFile()" name="photoPic" multiple="true" class="form-input file-pic"/>
                        </div>
                    </div>
                     <div class='form-div'>
                        <label class="form-label">营业执照复印件<b>*</b></label>
                        <div class="up-pic">
                            <img src="" id="oldImg" > 
                            <span>+</span>
                            <input type="file" id="licensePic" onchange="oldFile()" name="licensePic" multiple="true" class="form-input file-pic"/>
                        </div>
                    </div>

发表评论取消回复

表情：

评论列表（有 0 条评论，379人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue+SpringBoot实现图片上传和回显

[在这里插入图片描述][20190828150901694.png] > 1. 点击Vue图标，选择电脑中图片，选中后把图片替换为选中图片 > 2. 点击上传，通过...

短命女/ 2024年04月17日 16:13/ 0 赞/ 220 阅读

相关 Vue图片回显标签教程 - 实现图片上传和回显功能

系列文章目录 -------------------- 文章目录系列文章目录前言一、准备工作二、HTML模板三、HTML模

Love The Way You Lie/ 2023年10月14日 14:31/ 0 赞/ 197 阅读

相关 SpringBoot vue图片上传不能立即回显问题解决

> 最开始项目是放在eclipse之中的、springboot项目默认把静态的文件加载到classpath的目录下的。而此时我们上传的图片并没有传入启动了的项目当中去、所以明明

刺骨的言语ヽ痛彻心扉/ 2023年10月01日 11:54/ 0 赞/ 30 阅读

相关 springboot项目图片上传，不能立即回显问题（已解决）

问题如下 ![在这里插入图片描述][20191115150024289.png] 当上传一个图片，是这样显示的。我的解决方案 1.将springboot配置成

不念不忘少年蓝@/ 2023年06月13日 09:29/ 0 赞/ 243 阅读

相关 vue.js+ jquery上传图片并回显

文章目录 js关键代码 html关键代码 js关键代码 var vm = new Vue({ el: 'rrapp',

曾经终败给现在/ 2023年03月01日 11:54/ 0 赞/ 79 阅读

相关 elementUI图片上传，并实现图片回显（正式上传服务器之前就能回显）

效果图： ![在这里插入图片描述][20210304160205579.png] ![在这里插入图片描述][20210304160220708.png] 实现方法

电玩女神/ 2022年11月05日 06:30/ 0 赞/ 1586 阅读

相关 js实现上传图片立即回显

<script type="text/javascript"> //门头照片 function newFile() { var windowURL = window.U

女爷i/ 2022年09月30日 10:59/ 0 赞/ 380 阅读

相关图片上传服务器-回显

jar包 ![jar包][jar] 配置文件  <bean id="multipartResolver" cla

àì夳堔傛蜴生んèń/ 2022年06月06日 08:46/ 0 赞/ 427 阅读

相关跨服务器上传-图片服务器-图片回显-列表回显

jar包 ![jar包][jar] 配置文件  <bean id="multipartResolver" cla

心已赠人/ 2022年06月06日 08:46/ 0 赞/ 489 阅读

相关 HTML上传图片的回显

document.getElementById("showImg").src = window.URL.createObjectURL(personsFile.file

- 日理万妓/ 2022年05月25日 12:55/ 0 赞/ 676 阅读