需求:1.采集图片(需限制张数,大小,像素)
2.添加时间水印
解决方案:1.图片上传采用input标签type=“file”
2.水印使用canvas来绘制;
经过一翻开发测试,成功封装成为一个小插件,使用方式easy,easy,easy如下
1.准备一个盒子
<div class="selectPhotos"></div>
2.初始化,over,over,over,是的就这样简单
new PhotosUpload(".selectPhotos", function(e) {
this.init({
callback: function(imgDatas) {
console.log(imgDatas)
}
});
});
maxNum | number | 最大图片数量(默认值:9) |
maxWidth | number | 像素限制宽度(默认值:10000) |
maxHeight | number | 像素限制高度(默认值:10000) |
maxSize | number | 最大尺寸(默认值:10M) |
dateWaterMark | boolean | 是否显示时间水印(默认值:false),格式为:年-月-日 时:分 |
onlyCamera | boolean | 仅拍照上传,不许选择图片(默认值:false) |
代码下载路径:
图片上传及预览+时间水印-Javascript文档类资源-CSDN下载
扫码关注公众号,更多实践分享: