webjs--获取上传图片的缓存路径展示在页面上

来源:互联网 发布:淘宝客服忙吗 编辑:程序博客网 时间:2024/06/03 00:04
<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title></title></head><body><div class="ge_pic_icon_Infor">    <img src="images/moren.jpg"/></div><div class="Infor_file">    <input type="file" name="uploadPicture" id="file" value="" title="上传照片" onchange="getPhoto(this)"/></div><script src="javascript/jquery-1.12.1.js"></script><script type="text/javascript">    var imgurl = "";    var cd=document.getElementById("file");    function getPhoto(node) {        console.dir(node)        var imgURL = "";        try{            var file = null;            if(node.files && node.files[0] ){                file = node.files[0];                console.dir(file);            }else if(node.files && node.files.item(0)) {                file = node.files.item(0);            }            //Firefox 因安全性问题已无法直接通过input[file].value 获取完整的文件路径            try{                imgURL =  file.getAsDataURL();                console.log(imgURL)            }catch(e){                imgRUL = window.URL.createObjectURL(file);  //好像这一步比较重要                                            }        }catch(e){            if (node.files && node.files[0]) {                var reader = new FileReader();                reader.onload = function (e) {                    imgURL = e.target.result;                };                reader.readAsDataURL(node.files[0]);            }        }        creatImg(imgRUL);        return imgURL;    }    function creatImg(imgRUL){        var textHtml = "<img src='"+imgRUL+"'width='414px' height='600px'/>";        $(".ge_pic_icon_Infor").html(textHtml);    }</script></body></html>

阅读全文
0 0
原创粉丝点击