关于循环生成动态二维码遇到的QRCODE.JS不调用生成图片方法打印图片不显示
JQUERY JS 请自行转化,本例俩种方法混合使用
-
需求
由于有需求,需要做一个标签,左边是动态流水号,动态箱号,右边是根据左边内容变化,

-
在写代码的时候,把生成二维码的QRCODE 调用方法写在了循环里,结果调试发现,预览界面生成的都是CANVAS的二维码,但是window.print()打印inner HTML 打印不出来 CANVAS 内容.
QRCODE 方法生成了一个CANVAS和一个IMG区域,默认CANVAS DISPLAY:BLOCK
img DISPLAY:NONE
查看QRCODE.js 发现了在这里生成的IMG,断点调试发现在进入循环后,生成二维码的方法就只进行了生成CANVAS的操作,后面没有,于是想到强转。 -
转化成功
找了好多资料,都是直接说用.todataURL 转化,但是都不行,都会提示.todataURL is not a function,后来只在一个地方找到todataURL 只能针对原生CANVAS 也就是下例:
var c = document.createElement('canvas');
c.toDataURL();
针对非原生canvas,需要加一个定义
$("#qrCode" ).find("canvas")

在实现动态循环生成二维码并打印的过程中,遇到QRCODE.js未调用生成图片方法导致打印时图片不显示的问题。通过深入研究QRCODE.js源码,发现循环中仅生成了CANVAS而未生成IMG。为解决此问题,需要将CANVAS转化为DataURL。然而直接使用.toDataURL方法报错,需确保针对原生CANVAS。最终通过调整代码,成功实现循环内二维码的正确打印。

1万+

被折叠的 条评论
为什么被折叠?



