1:使用FileReader;参考https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader
var reader = new FileReader();
reader.readAsDataURL(file); //正式读取文件
reader.onloadend =function() {
let readResult = reader.result;
$('#editorImg').attr('src',readResult);
}
2:使用
let windowURL = window.URL || window.webkitURL;
if (file) {
let dataURL = windowURL.createObjectURL(file);
$('#editorImg').attr('src', dataURL);
}
代码案例:
$('#chooseFile').change(function(ev){
let file = document.getElementById('chooseFile').files[0];
if(file) {
let type = file.type.split('/')[0];
if (type != 'image') {
alert('您选择的不是图片!');
return;
}
// let windowURL = window.URL || window.webkitURL;
// if (file) {
// let dataURL = windowURL.createObjectURL(file);
// $('#editorImg').attr('src', dataURL);
// $('#editorImg').attr('alt','true');
// console.log($('#jcropImg'))
// // let editorImgSrc = $('#editorImg').attr('src');
// // console.log( editorImgSrc )
// }
var reader = new FileReader();
reader.readAsDataURL(file); //正式读取文件
reader.onloadend =function() {
let readResult = reader.result;
$('#editorImg').attr('src',readResult);
$('#editorImg').attr('alt','true');
$('#jcropImg').attr('src',readResult)
};
}
});