我试图在上传之前预览图像。为此,我有一个在用户上传图片时将其加载的图片。
通过单击预览图像,用户可以取消上传,并且预览图像将消失。但是,如果用户已经选择了图像,则在选择要上传的文件时单击“取消”(因为他改变主意等),先前选择的图像仍将保留,并且不会消失。
无论如何,在这种情况下是否要删除预览的图像?
HTML:
<input type='file' id='input1'>
<img id='imagepreview1'>
jQuery的:
$(document).ready(function(){
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#imagepreview1').prop('src', e.target.result).show();
}
reader.readAsDataURL(input.files[0]);
}
}
$("#input1").change(function () {
readURL(this);
$('#imagepreview1').show();
});
$('#imagepreview1').click(function(){
$('#input1').replaceWith($('#input1').clone(true));
$('#imagepreview1').hide();
});
});
最佳答案
每次单击都会删除图像的src,
$("#input1").click(function () {
$('#imagepreview1').attr('src','');
});
DEMO