javascript重新启动onchange事件 函数预览（输入）{ if（input.files&&input.files[0]）{ var reader=new FileReader（）； reader.onload=函数（e）{$（'#previewImage'）.attr（'src'，e.target.result）；} reader.readAsDataURL（input.files[0]）； //1.检测图像原始宽度和高度 var imgWidth=$（“#预览图像”）.width（）； var imgHeight=$（“#预览图像”）.height（）； //2.运行缩略图类并获得缩放的宽度和高度 维度=新缩略图（imgWidth、imgHeight）； var previewWidth=dimension.newWidth； var previewHeight=dimension.newHeight； //3.用于预览的尺寸宽度和高度 $（“#预览图像”）。宽度（预览宽度）； $（“#预览图像”）。高度（预览视图）； $（“#预览图像”）.show（）；

我有一个输入型上传文件，我在上传前使用fileReader进行预览， 我创建了一个类，以缩小图像的大小以进行预览

当用户第一次上传图像时，它工作得非常完美

但如果用户再次点击上传。 第二个图像将使用上一个宽度和高度，是否可以重新启动onChange 因此它不会使用以前的宽度和高度

这样，缩略图总是50像素宽。只需将

width=“50”

更改为您想要的任何值。或者，如果您总是希望高度相同，则将其替换为高度。

您可以创建一个新的缩略图吗？

<script>
function preview(input){    
    if(input.files && input.files[0]) {
    var reader = new FileReader();

    reader.onload = function(e){$('#previewImage').attr('src', e.target.result);}
    reader.readAsDataURL(input.files[0]);

    //1. detect image original width & height
    var imgWidth=$("#previewImage").width();
    var imgHeight=$("#previewImage").height();

    //2.run thumbnail class & get scale down's width and height         
    dimension= new thumbnail(imgWidth,imgHeight);
    var previewWidth=dimension.newWidth;    
    var previewHeight=dimension.newHeight;

    //3.chnage width & height for preview           
    $("#previewImage").width(previewWidth);
    $("#previewImage").height(previewHeight);

    $("#previewImage").show();
</script>


<input type='file' id="uploadImg" onchange="preview(this)" />
<img id="previewImage" />