使用jquery的jqcode插件生成二維碼，並能打印
阿新 • • 發佈：2017-12-11
input i++ alt meta 插件 splay can update play
本文參考這個而來：https://www.cnblogs.com/chenyucong/p/5996544.html
使用的js有三個，第一個是jquery，放在第一位，第二個是二維碼生成插件jquery.qrcode.js，第三個是打印插件jquery.jqprint-0.3.js
下面是一個簡單的例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>二維碼</title>
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
<script src="../js/jquery.jqprint-0.3.js"></script>
<style>
@media screen
{
#canvas
{
display: block;
}
img
{
display: none;
}
}
/*打印狀態下的樣式*/
@media print
{
#canvas
{
display: none;
}
img
{
display: block;
}
}
</style>
</head>
<body>
<input type="text" id="txt">
<button id="btnEncode">生成二維碼</button>
<button id="btnPrint" >打印</button>
<hr />
<div id="code"></div>
第一點：
canvas標簽並不能直接打印，因為是動態的，打印會顯示空白，
這裏是借用了一個img標簽，先把canvas圖像賦予給img，再打印img，由於上方有定義img標簽的display屬性為none，所以不會顯示。
第二點：
在84和85行，獲取canvas和img的標簽時，不能使用jq來獲取，不然會報錯，錯誤如下
第三點：
render的屬性可以改為table，但是改為table的時候，無法打印，因為不是圖像，不能轉移為img。
最終效果圖如下：
點擊生成二維碼圖
點擊打印圖
使用jquery的jqcode插件生成二維碼，並能打印