function packFile(){
$('#bigImgGroup').removeClass('imageGroup')
$('#exampleFormControlFile1').change(function(){
$('#bigImgGroup').addClass('imageGroup')
if($(this).get(0).files.length == 0){
$('#bigImgGroup').removeClass('imageGroup');
}
var newGroup = '<div class="col-sm-10 col-sm-offset-2" id="imageGroup"></div>'
$('#imageGroup').replaceWith(newGroup);
$($(this).get(0).files).each(function(){
var file = $(this)[0]
console.log(file)
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload=function(e){
var img = e.target.result
var newImg ="<div class='col-sm-2 goodsSlImg' style='padding:0;'><img class='imgContent' src='"+img+"'></div>"
$('#imageGroup').append(newImg)
}
})
})
}
上传文件缩略图
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- /** * 单文件上传 * name:表单上传文件的名字 * ext: 文件允许的后缀,字符串形式 * path:...
- https://stackblitz.com/edit/angular-upload-image-display-...
- 该文是wecenter学习笔记的一部分 上传图片并生成缩略图 这部分主要由两个模块合力完成 core_upload...