在使用IE9上传图片之前预览图片中的图片

如何在上载图片之前预览图片？预览操作应在所有浏览器中执行，而不使用Ajax来上传图像。在使用IE9上传图片之前预览图片中的图片

大部分例子都使用FileReader，它不会在IE9中工作。

是否有任何插件或任何替代方案，使其在IE9

f (input.files && input.files[0]) { 
    var reader = new FileReader(); 

    reader.onload = function (e) { 
     $('#blah').attr('src', e.target.result); 
    } 

    reader.readAsDataURL(input.files[0]); 
}

来源

2016-04-03 Cork Kochi

JavaScript的工作：

$('#fileID').on('change',function(){ } 
    var imageName = ''; 
    if (this.files && this.files.length > 0) { 
     imageName = this.files[0].name; 
    } 
    else if (this.value) { 
     imageName = this.value; 
    } 
    if (window.FileReader) { 
     //as same as other samples 
    } 
    else{ 
     var image = document.getElementById('imgItem'); 
     image.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale', src='" + imageName + "')"; 
     image.src = 'data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=='; 
    } 

//code end

我觉得这是行之有效的仿真，IE9。

另一种方式来绘制图像：

var canvas = document.getElementById('imgArea'); 
var img = new Image(); 
img.src = imageName; 
img.onload = function() { 
　　var ctx = canvas.getContext("2d"); 
　　ctx.drawImage(img, 0, 0, 200, 200); 
}

注：添加2017/12/27

一个解决方案预览与IE-9的局部图像： IE-9 does`nt支持FileReader，所以我试图先上传它，然后将imageName（带有服务器路径）返回到View以更改img的'src'属性。它运作良好。

点数：（该示例是使用MVC）

1.In输入型文件的 '改变' 事件，执行ajaxSubmit会（操作方法：无效）

2.In的控制器使用[Newtonsoft.Json.JsonConvert.SerializeObject]返回json格式的字符串。

Response.Write（strData）;

3.在ajaxSubmit的回调中，只需更改img的src即可。（不要忘记将结果转换为json）

来源

2017-12-21 03:03:12 CoderMonkey

这里是更新的代码。希望对你有效。

if (input.files && input.files[0]) { 
    var url = URL.createObjectURL(input.files[0]); 
    $('#blah').attr('src', url); 
}

来源

2017-12-21 04:42:15

在使用IE9上传图片之前预览图片中的图片

回答

相关问题