获取file图片上传类型的图片地址并显示图片

<script type="text/javascript"> 
function getFileUrl(sourceId) {
    var url;
    if (navigator.userAgent.indexOf("MSIE") >= 1) { // IE
        url = document.getElementById(sourceId).value;
    } else if (navigator.userAgent.indexOf("Firefox") > 0) { // Firefox
        url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
    } else if (navigator.userAgent.indexOf("Chrome") > 0) { // Chrome
        url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
    }
    return url;
}

function preImg(sourceId, targetId) {
    var url = getFileUrl(sourceId);
    var imgPre = document.getElementById(targetId);
    imgPre.src = url;
    alert(url);
}
</script> 

<form action=""> 
<input type="file" name="" id="imgUp" onchange="preImg(this.id,'imgPre');" /> 
<img id="imgPre" src="" width="100" height = "100" /> 
</form> 

 

posted on 2014-10-21 14:56  bigdesign  阅读(1570)  评论(0编辑  收藏  举报