javascript - 尝试在输入文件的 onChange 事件上显示图像

Question

我试图直接在输入文件的 onchange 事件上选择图像后显示图像，我弄清楚它在所有浏览器中是如何完成的，但我在 safari 中停下来，我试图获取

inputFile.value 属性，但它返回给我一个假路径，即使解决该问题，我也需要帮助，但我不需要回发。

问候

Answer 1

假设您的输入和图像如下

<img id="PreviewImage" src="" alt="?" style="height:100px;"  />
<input id="ImageFileUpload" onchange="readURL(this);" type="file" runat="server"/>

function readURL(input) {
if (input.files && input.files[0]) {//Check if input has files.
var reader = new FileReader(); //Initialize FileReader.

reader.onload = function (e) {
$('#PreviewImage').attr('src', e.target.result);
$("#PreviewImage").resizable({ aspectRatio: true, maxHeight: 300 });
};
reader.readAsDataURL(input.files[0]);
} 
else {
$('#PreviewImage').attr('src', "#");
}
}