点击图片上传实时预览 2022-05-08 12:16 456阅读 0赞 html源代码如下: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <title>图片上传</title> </head> <style> div#showdiv{ width:200px; } img#showimg{ cursor:pointer; } </style> <body> <center> <form > <div id="showdiv"> <label for="upfile"> <img name="showimg" id="showimg" src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=687491883,734414948&fm=26&gp=0.jpg" style="display:block;" alt="预览图片" width="300" /> </label> </div> <input name="upfile" type="file" id="upfile" size="40" onchange="viewmypic(showimg,this.form.upfile);" style="display:none;" /> <br /> </form> <br /> </div> <div style="display:none"> </div> </center> <script> function viewmypic(mypic,upfile) { if(upfile.files && upfile.files[0]) { mypic.style.display=""; //火狐下,直接设img属性 //mypic.src = upfile.files[0].getAsDataURL(); //火狐7以上版本不能用上面的getAsDataURL()方式获取,需要一下方式 mypic.src = window.URL.createObjectURL(upfile.files[0]); } else { //IE下 if (upfile.value){ mypic.src=upfile.value; mypic.style.display=""; mypic.border=1; } } } </script> </body> </html>
相关 uni-app点击预览图片 <image :src="info.shopLogoUrl" @tap="_previewImage(info.shopLogoUrl)" mode="widthFi 朴灿烈づ我的快乐病毒、/ 2022年12月02日 00:43/ 0 赞/ 476 阅读
相关 vue中按钮点击上传图片并预览 html部分: <input type="file" ref="filElem" class="upImage" accept="image/" @change=" - 日理万妓/ 2022年11月14日 13:18/ 0 赞/ 202 阅读
相关 微信图片点击预览 $(function(){ var imgsurl=[]; var nowurl=''; var imgObj=$(".swi 快来打我*/ 2022年06月08日 09:50/ 0 赞/ 545 阅读
相关 点击图片上传实时预览 html源代码如下: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset 快来打我*/ 2022年05月08日 12:16/ 0 赞/ 457 阅读
相关 一个图片上传预览 一、一个按钮上传文件操作 前台选择文件,只能通过input的file类型的文件选择框操作。但有时却为了界面的美观,要求用按钮来完成。 第一步、隐藏文件选择框 第二步、 ╰半橙微兮°/ 2022年04月08日 11:56/ 0 赞/ 432 阅读
相关 点击头像按钮实现图片上传并预览 背景 手机添加通讯录时,希望实现点击图片上传头像,这里主要包含两个功能 1. 将上传图片的input按钮替换为指定图片,点击图片是触发input的上传事件。 2. 淡淡的烟草味﹌/ 2021年12月11日 23:29/ 0 赞/ 672 阅读
相关 上传图片并预览 HTML: <input accept="image/" name=" fileImage" type="file" onchange="upload"> < Myth丶恋晨/ 2021年11月23日 10:16/ 0 赞/ 587 阅读
相关 extjs上传图片预览 [EXTJS图片上传预览(含本地上传前预览和服务器图片预览)][EXTJS] 创建EXTJS组件 ![复制代码][copycode.gif] 1 //生成me 系统管理员/ 2021年09月10日 07:04/ 0 赞/ 610 阅读
相关 uni-app点击预览图片 <image :src="info.shopLogoUrl" @tap="_previewImage(info.shopLogoUrl)" mode="widthFi 忘是亡心i/ 2021年07月24日 21:31/ 1 赞/ 1148 阅读
相关 uniapp 上传图片、点击预览图片 1、在回调中打开本地相册 uni.chooseImage({ count:上传照片数量, //浏览器无法限制,默认上传数量为9 比眉伴天荒/ 2021年07月24日 11:07/ 0 赞/ 1462 阅读
还没有评论,来说两句吧...