当前位置:首页 > Web开发 > 正文

图片上传预览

2024-03-31 Web开发

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

上传图片的方法链接为: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方法后在上传图片时  选取图片成功后会立即实现上传后将图片显示到上传框内

上传图片后的显示效果图

技术图片

技术图片

温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/39794.html