文档章节

图片时,对图片进行预览

D
 DailyDiary
发布于 2017/07/20 16:43
字数 127
阅读 1
收藏 0

jsp:

  <div class="item3 item3-down">
                        <span>*文件:</span>
                        <div class="pageButton_empty file-ID">上传文件<input id="urlBusinessLicense" name="urlBusinessLicense" type="file" style="display:block;margin-top:20px;" onchange="preview2(this)"/></div>
                        <div style="display:inline-block;color:#888;line-height:40px;height:40px;vertical-align:top;">(文件大小不得超过5M)</div>
                    </div>
                    <div id="yyzz" style="width:160px;height:200px;margin-left:185px;background-image:url('images/image.png');background-size:100%;background-repeat:no-repeat;background-position:center;background-color:#F5F5F5;"></div>
                

javascript
            function preview2(file){
                if (file.files && file.files[0]){  
                    var reader = new FileReader();  
                    reader.onload = function(evt){
                         $("#yyzz").css("background-image", "url('"+evt.target.result+"')");
                    }    
                     reader.readAsDataURL(file.files[0]);  
                }else{  
                    $("#yyzz").css("background-image", "url('images/image.png')");
                }
             }

 

© 著作权归作者所有

D
粉丝 0
博文 19
码字总数 4467
作品 0
私信 提问
一个体验好的Windows 任务栏缩略图开发心得

本文来自网易云社区 作者:孙有军 前言: 对于一个追求极致体验的软件来说,利用好系统的每一点优秀的特性,将会大大提高软件的品质。 Windows vista以来任务栏缩略图,及Win + TAB的程序切换...

网易云
2018/09/27
0
0
【前端】图片裁剪(二)Jcrop实现裁剪

学着做自己,并优雅的放手不属于自己的。 前一篇文章已经跟大家讲述了如何利用JavaScript实现Web端图片裁剪功能。可能对大多数人来说,利用JavaScript去实现裁剪功能比较费事,那这一篇文章将...

zrunker
2017/10/25
0
0
前端图片预览,上传前预览【兼容IE7、8、9、10、11,Firefox,Chrome】

在现在的Web开发中不可避免的会做一个图片预览的功能,比如在上传图片的情况下,一个很简单的办法就是讲图片上传至服务器之后,再将文件的URL返回回来,然后异步通过这个URL加载刚刚上传的图...

IT智云编程
2018/11/05
0
0
H5 和小程序拍照图片旋转、压缩和上传

原文地址:github.com/whinc/blog/… 最近接到一个“发表评论”的需求:用户输入评论并且可以拍照或从相册选择图片上传,即支持图文评论。需要同时在 H5 和小程序两端实现,该需求处理图片的...

whinc
2018/09/29
0
0
WebUploader的缩略图如何在后台保存以及下次打开页面时如何展示的问题

大家好,我的使用场景如下:(我觉得比较通用) 用户在需要专家帮忙的时候需要填写文字信息以及上传图片 可上传多图,每选择一个图片无需点击“上传”按钮而自动上传 上传成功后,出现缩略图...

错觉
2015/12/09
10.3K
6

没有更多内容

加载失败,请刷新页面

加载更多

Spring Boot + Mybatis-Plus 集成与使用(二)

前言: 本章节介绍MyBatis-Puls的CRUD使用。在开始之前,先简单讲解下上章节关于Spring Boot是如何自动配置MyBatis-Plus。 一、自动配置 当Spring Boot应用从主方法main()启动后,首先加载S...

伴学编程
昨天
7
0
用最通俗的方法讲spring [一] ──── AOP

@[TOC](用最通俗的方法讲spring [一] ──── AOP) 写这个系列的目的(可以跳过不看) 自己写这个系列的目的,是因为自己是个比较笨的人,我曾一度怀疑自己的智商不适合干编程这个行业.因为在我...

小贼贼子
昨天
7
0
Flutter系列之在 macOS 上安装和配置 Flutter 开发环境

本文为Flutter开发环境在macOS下安装全过程: 一、系统配置要求 想要安装并运行 Flutter,你的开发环境需要最低满足以下要求: 操作系统:macOS(64位) 磁盘空间:700 MB(不包含 IDE 或其余...

過愙
昨天
6
0
OSChina 周六乱弹 —— 早上儿子问我他是怎么来的

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @凉小生 :#今日歌曲推荐# 少点戾气,愿你和这个世界温柔以待。中岛美嘉的单曲《僕が死のうと思ったのは (曾经我也想过一了百了)》 《僕が死の...

小小编辑
昨天
2.7K
16
Excption与Error包结构,OOM 你遇到过哪些情况,SOF 你遇到过哪些情况

Throwable 是 Java 中所有错误与异常的超类,Throwable 包含两个子类,Error 与 Exception 。用于指示发生了异常情况。 Java 抛出的 Throwable 可以分成三种类型。 被检查异常(checked Exc...

Garphy
昨天
42
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部