//preview img : filereader方式 document.getElementById('imgFile').onchange = function(e){ 5 var ele = document.getElementById('imgFile').files[0]; var fr = new FileReader(); fr.onload = function(ele){ var pvImg = new Image(); pvImg.src = ele.target.result; pvImg.setAttribute('id','previewImg'); $('.preview_wrap').html('').append(pvImg);18 } fr.readAsDataURL(ele); }
//preview img : URL.createObjectURL 方式 document.getElementById('imgFile').onchange = function(e){ var ele = document.getElementById('imgFile').files[0]; var createObjectURL = function(blob){ return window[window.webkitURL ? 'webkitURL' : 'URL']['createObjectURL'](blob); }; var newimgdata = createObjectURL(ele); var pvImg = new Image(); pvImg.src = newimgdata; pvImg.setAttribute('id','previewImg'); $('.preview_wrap').html('').append(pvImg); }
createObjectURL獲得的是http格式的文件,即便input file的文件類型不存在也不會編碼失敗。html