html5中怎么实现图片上传预览功能-创新互联

今天就跟大家聊聊有关html5中怎么实现图片上传预览功能，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

成都创新互联公司是一家专注于成都网站制作、成都做网站、外贸营销网站建设与策划设计,苏仙网站建设哪家好?成都创新互联公司做网站,专注于网站建设十余年,网设计领域的专业建站公司;建站业务涵盖:苏仙等地区。苏仙做网站价格咨询:13518219792

<!DOCTYPE html><html lang="zh-cn"><head><meta charset="utf-8" /><meta name="author" content="EdieLei" /><title>HTML5 图片上传预览</title><script type="text/javascript" src="<a href="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script">http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script</a>><script type="text/javascript">$(function(){    $('#img').change(function(){        var file = this.files[0];    //选择上传的文件        var r = new FileReader();        r.readAsDataURL(file);    //Base64        $(r).load(function(){            $('div').html('<img src="'+ this.result +'" alt="" />');        });    });});</script></head><body><h4>HTML5 图片上传预览</h4><input id="img" type="file" accept="image/*" /><div></div></body></html>

看完上述内容，你们对html5中怎么实现图片上传预览功能有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注创新互联行业资讯频道，感谢大家的支持。

当前题目：html5中怎么实现图片上传预览功能-创新互联
网页地址：https://www.cdcxhl.com/article42/dhjoec.html

成都网站建设公司_创新互联，为您提供网站导航、品牌网站制作、网站改版、网站排名、网站设计、动态网站

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容