日期:2014-05-16  浏览次数:20314 次

js上传预览图片
现需要实现图片上传之前进行预览,网上也有很多相关代码,但均有浏览器兼容性的问题。Firefox9.0以上,ie6,ie7,谷歌以及ie内核的浏览器都支持的实在找不到。
问题在于获取图片的完整路径不同,ie取到的是完整路径,加载本地图片自然没有问题,但Firefox9.0和谷歌取到的是文件名,若能解决不同浏览器都能取到图片的完整路径,问题就解决了。
function showImage(imgFile) {
  var fileName = document.getElementById("fileId").value;
  if (window.navigator.userAgent.indexOf("MSIE")>=1){
  imgFile.select();
  return document.selection.createRange().text;
  }
  //firefox
  else if(window.navigator.userAgent.indexOf("Firefox")>=1){
  if(imgFile.files){
  return imgFile.files.item(0).getAsDataURL();
  }
  return imgFile.value;
  }
}
Firefox7.0上以已经不支持getAsDataURL()方法,谷歌如何判断?求高人指点

------解决方案--------------------
楼主。。。。
试试这个方法吧:
JScript code

function getFullPath(obj) {
    if (obj) {
        //IE
        if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
            obj.select();
            obj.blur();
            // IE下取得图片的本地路径
            return document.selection.createRange().text;
        }
        //firefox
        else if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
            if (obj.files) {
                // Firefox下取得的是图片的数据
                var value = "";
                try{
                    value = window.URL.createObjectURL(obj.files[0]);
                }catch(e){
                    value = obj.files[0].getAsDataURL();
                }
                return value;
            }
        }
        return obj.value;
    }
}

------解决方案--------------------
ff

window.URL.createObjectURL

chrome

window.webkitURL.createObjectURL ...