需求场景
需要根据已给的链接,根据链接生成一个二维码。并在页面上提供点击即可下载该二维码的按钮或链接(链接生成二维码的方法 见链接)
JSP代码
<button class="xxx" id="qrCode">二维码下载</button>
JS代码
这里使用到了layui和Jquery的相关知识
//下载图片
//使用JQuery根据ID操作到该按钮并绑定点击事件
$("#qrCode").on('click',function () {
layer.msg("正在下载");//使用toast提示
var image = new Image();//创建一个Image图片
//为该图片设置图片链接(picUrl注意不能是本地图片的地址)
image.src = picUrl;
image.setAttribute('crossOrigin', 'anonymous');
image.onload=function () {//图片加载处理函数
var canvas = document.createElement('canvas');
canvas.width = image.width;//canvas画布
canvas.height = image.height;
var context = canvas.getContext('2d');
context.drawImage(image,0,0,image.width,image.height);
var url = canvas.toDataURL('image/png')
var a = document.createElement('a');
var event = new MouseEvent('click');
a.download = '活动图片二维码';
a.href = url;
a.dispatchEvent(event);
}
})