H5上传图片和获得图片关键代码

最新推荐文章于 2024-02-22 10:04:44 发布

不破小子

最新推荐文章于 2024-02-22 10:04:44 发布

阅读量3.7k

点赞数

分类专栏： web前端大杂烩

本文链接：https://blog.csdn.net/chenshuyang716/article/details/51191411

版权

web前端大杂烩专栏收录该内容

32 篇文章 0 订阅

订阅专栏

var imgObject=document.getElementById("selectPhoto");
//定义读取文件的io流
var imgReader=new FileReader();
//验证图片的正则表达式
var imgTest=/^(?:image\/bmp|image\/cis\-cod|image\/gif|image\/ief|image\/jpeg|image\/jpeg|image\/jpeg|image\/pipeg|image\/png|image\/svg\+xml|image\/tiff|image\/x\-cmu\-raster|image\/x\-cmx|image\/x\-icon|image\/x\-portable\-anymap|image\/x\-portable\-bitmap|image\/x\-portable\-graymap|image\/x\-portable\-pixmap|image\/x\-rgb|image\/x\-xbitmap|image\/x\-xpixmap|image\/x\-xwindowdump)$/i;
//初始化图片
imgReader.onload = function (oFREvent) {
    debugger;
    layer.msg(oFREvent.target.result);
   $btnlayer.before("<img class=\"img-item\"  width=\"100px\" height=\"100px\" src=\""+oFREvent.target.result+"\"/>");
    $backlayer.hide();
};
loadImageFile();
//获取上传图片的按钮
var $btnUploadImg=$("#selectPhoto");
$btnUploadImg.change(loadImageFile);

function loadImageFile(){
    //判断是否有文件
    if(imgObject.files.length==0){
        return;
    }
    var img=imgObject.files[0];
    if(!imgTest.test(img.type)){
        alert("类型不对");
    }
    imgReader.readAsDataURL(img);
    alert("读不了");
}