日常js上传图片预览效果

作者: banbans | 来源:发表于2018-03-29 14:06 被阅读0次

html代码

<div class="col-md-6">
    <img src="" alt="暂无头像" class="img" >
    <input name="" type="file" class="itxt" id="desigerPic" >
</div>

js代码

var mypic=document.getElementById(obj).files[0];
document.getElementById(showPhoto).src=window.URL.createObjectURL(mypic);

jq代码

var mypic=$(this).get(0).files[0];
$(this).siblings('.img').attr('src',window.URL.createObjectURL(mypic));

日常js上传图片预览效果
html代码 js代码 jq代码
Laravel 中 bootstrap fileinput 图
1、图片上传并预览效果展示： 2 图片上传成功之后的预览图片上传之后编辑预览效果展示： 3 图片预...
javascript操作文件对象File和FileReader
验证文件格式上传图片且预览图片效果
js图片上传预览
项目中碰到一个需求，上传图片及时给用户预览。开始的想法就是上传的图片先传递到后台，在通过ajax获取图片路径显示到...
JS图片上传预览
划水摸鱼的时候研究了JS图片的上传预览，分别是FileReader()、createObjectURL()，在此分...
封装直传阿里云存储文件上传控件
本文目标封装一个直传阿里云OSS云存储图片上传控件控件效果图上传之前上传成功预览图片文件上传前后台及阿...
JS 上传图片实时预览
html 代码表单form 不要忘了加enctype="multipart/form-data" js 代码
JS图片上传预览（一）
URL.createObjectURL()静态方法会创建一个 DOMString。其中包含一个表示参数中给出的对象...
js上传图片实时预览
js图片压缩预览
图片压缩预览（具体上传请看另外一篇文章，讲解的更详细图片压缩上传） html结构 js代码 css代码欢迎访问我...