js 实现图片预览方式？

 

 

<img src="" alt="" width="100px" height="100px" class="img_show">
<input type="file" value="选择图片" name=""  onchange="preview(this)" accept="image/*" class="file">

 

//图片预览
    function  preview(obj) {
        var fileType = obj.files[0].type;
        if("image/jpg" != fileType && "image/jpeg" != fileType && "image/png" != fileType) {
            $(obj).val("");
            layer.msg("只能上传JPG,JPEG,PNG格式的图片");
            return false;
        }
        var fileSize = obj.files[0].size;
        if( fileSize > 1024*150 ){
            $(obj).val("");
            layer.msg("图片大小不能超过"+150+"k");
            return false;
        } 
        var url;
        if (navigator.userAgent.indexOf("MSIE")>=1) {
            url = obj.val();
        } else if(navigator.userAgent.indexOf("Firefox")>0) {
            url = window.URL.createObjectURL(obj.files.item(0));
        } else if(navigator.userAgent.indexOf("Chrome")>0) {
            url = window.URL.createObjectURL(obj.files.item(0));
        }else{
            url = window.URL.createObjectURL(obj.files.item(0));
        }
        $(obj).parents('tr').find('.img_show').attr('src',url);
    }