- 当我上传图片时,你能告诉我如何在红框内显示图片吗
- 提供以下代码
http://codepen.io/anon/pen/ZWXmpd
<div class="upload-image">
<div class="upload-image-preview"></div>
<input type="file" name="file" value="Upload Image" />
</div>
最佳答案
您可以使用类似的东西在上传前显示您的图片。
var _URL = window.URL || window.webkitURL;
$("#file").change(function(e) {
var image, file;
if ((file = this.files[0])) {
image = new Image();
image.onload = function() {
src = this.src;
$('#uploadPreview').html('<img src="'+ src +'"></div>');
e.preventDefault();
}
};
image.src = _URL.createObjectURL(file);
});
#uploadPreview {
border: 1px solid red;
width: 200px;
height: 200px;
overflow: hidden;
}
#uploadPreview img {
min-width: 100%;
min-height: 100%;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" id="file"/>
<div id="uploadPreview">
</div>
关于javascript - 在 div 中显示上传的图片,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36382457/