码迷,mamicode.com
首页 > Web开发 > 详细

图片上传预览

时间:2019-12-21 13:54:35      阅读:94      评论:0      收藏:0      [点我收藏+]

标签:mic   span   wan   object   实现   指定   obj   change   col   

图片上传后怎样将上传的图片显示到上传框内

上传图片的方法链接为:https://www.cnblogs.com/yutang-wangweisong/p/12076484.html

做完以上方法后 你会发现上个个方法的Input框内会有个onchange="GetFile()" 方法调用  上传图片后会立即触发这个onchange事件

在写一个js方法onchange触发事件

 //图片上传后onchang触发的事件
    function GetFile() {

        //2 取上传后图片的值     
        //event.target.files[0]    获取指定上传控件内的第一个文件
        var a = event.target.files[0];
        //取文件的路径 注意 浏览器的保密协议
        var url = window.URL.createObjectURL(a);
        //上传图片后让图片显示到上传框
        $("#upimg").css(background, url( + url + )0% 0% / cover)
    }

添加onchange方法后在上传图片时  选取图片成功后会立即实现上传后将图片显示到上传框内

上传图片后的显示效果图

 

技术图片

 

 技术图片

图片上传预览

标签:mic   span   wan   object   实现   指定   obj   change   col   

原文地址:https://www.cnblogs.com/yutang-wangweisong/p/12076510.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!