zoukankan
html css js c++ java
上传并查看图片
<!DOCTYPE html> <!-- saved from url=(0034)http://localhost:61694/Image/Index --> <html style="" class=" js flexbox flexboxlegacy canvas canvastext webgl no-touch geolocation postmessage websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers no-applicationcache svg inlinesvg smil svgclippaths"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <pre><code><meta name="viewport" content="width=device-width"> <title></title> <link href="./Index_files/bootstrap.css" rel="stylesheet"> </code></pre> <link href="./Index_files/site.css" rel="stylesheet"> <pre><code><script src="./Index_files/modernizr-2.8.3.js.下载"></script> </code></pre> </head> <body> <style> .must{ color:red; font-size:14px; } .userImg1{ 240px; height:135px; display: inline-block; background-color: #f3f5f4; text-align: center; line-height: 135px; vertical-align: top; margin-top:13px; margin-left:8px; cursor:pointer; } .userImg1{ background-size: 240px 135px; } .sub-btn{ 92px; height:35px; background-color: #e1251a; display: block; margin:25px 0 0 94px; border:none; outline: none; color:#fff; cursor:pointer; } input[type="file"] { display: none; } </style> <pre><code><div> <h1>图片选择</h1> <div class="userImg1" onclick="uploadFile('userImg1')" style="background-image: url("blob:http://localhost:61694/5f866f8a-7399-4b10-9870-74e34a237b49");">+添加图片</div> <input type="file" name="uploadImg1" display="none" class="fileBtn" accept="image/*" onchange="dofileBtn(this)"> </div> </code></pre> <script src="./Index_files/jquery-3.3.1.js.下载"></script> <script type="text/javascript"> var fileBtn = document.getElementsByClassName("fileBtn"); function dofileBtn(e) { const fileObj = e.files[0]; const windowURL = window.URL || window.webkitURL; if (fileBtn && fileObj) { const imgURL = window.URL.createObjectURL(fileObj); $(".userImg1").css("background-image", "url(" + imgURL + ")"); } } function uploadFile(e) { $(".fileBtn").click(); } $(".fileBtn").on("change", dofileBtn); </script> <pre><code></div> </code></pre> </body></html>
查看全文
相关阅读:
django.db.utils.OperationalError: (1071, 'Specified key was too long; max key length is 767 bytes');
mysql的utf8与utf8mb4 异同;utf8mb4_unicode_ci 与 utf8mb4_general_ci 如何选择
/etc/skel 目录作用
react组件引用时的default常见错误
Java效率工具之Lombok
Java问题定位之如何借助线程堆栈进行问题分析
Java线程堆栈分析
Java问题定位之Java线程堆栈分析
Java项目性能瓶颈分析及定位(八)——Java线程堆栈分析(五)
SpringMVC的各种参数绑定方式
原文地址:https://www.cnblogs.com/yyl001/p/15699687.html
最新文章
IDEA 中使用MyBatis-generator 自动生成MyBatis代码
Intellij IDEA 14中使用MyBatis-generator 自动生成MyBatis代码
hash算法打散存储文件
Intellij IDEA创建maven项目无java文件问题
分析CSS布局中BFC
一些设计注意事项
2019第15周日
未来架构——从服务化到云原生
弄清楚我们想做什么
visio画图有感
热门文章
“数据上帝” Jeff Hammerbacher
数据科学家的定义
数据科学家的起源
2019第14周日
《代码大全》的作者Steve McConnell
javascript和python取dict字典对象的不同
django的动态url,url里含有参数,含有参数的url
api的mock开源工具;api文档生成器;api的mock工具;阿里系;其他开源
django的过滤和搜索排序功能django-filter
django:MySQL Strict Mode is not set for database connection 'default'
Copyright © 2011-2022 走看看