兼容低版本浏览器的图片选择预览方案

众所周知，低版本的浏览器在预览本地图片的问题上表现的差强人意，低版本浏览器并不支持FileReader对象。

<div id="picArea"></div>    //图片展示区域
<input type="file" onchange="preview(this)" />   //文件选择框

#picArea , .img,img {
    width: 200px;
    height: 200px;
  }
  #picArea{
    border: 1px solid #000;
  }

function preview(inputObj) {
    var prevDiv = document.getElementById('picArea');
    if (inputObj.files && inputObj.files[0]) {   //判断是否支持新的API
      var reader = new FileReader();
      reader.onload = function(evt) {
        prevDiv.innerHTML = '<img src="' + evt.target.result + '" />';
      }
      reader.readAsDataURL(inputObj.files[0]);
    } else {  //IE10以下版本解决方案
      prevDiv.innerHTML = '<div class="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + inputObj.value + '\'"></div>';
    }
  }