关于qrcode生成二维码的两种方式的区别

具体做的demo如下：

1、页面元素：地址输入框，canvas方式的显示div，table方式的显示div

<input id=”urlIn” placeholder=”请输入网址”>
<div class=”qrCodeShow” id=”canvas”></div>
<div class=”qrCodeShow” id=”table”></div>

2、引入jquery支持及jquery.qrcode支持，这两个都比较好找

3、js控制二维码生成

$(function(){
//获得焦点时添加url协议头http://
$(“#urlIn”).focus(function(){
$(“#urlIn”).val(“http://”);
});

//输入框失去焦点时显示输入框值
$(“#urlIn”).blur(function () {
$(“#canvas”).empty();
$(“#table”).empty();

var url = $(“#urlIn”).val();
// alert(url)
//canvas方式生成二维码（二维码是一张图片）
$(“#canvas”).qrcode(url);
//table方式生成二维码（二维码是由<table>标签的单元格填黑白框的方式形成）
$(“#table”).qrcode({
render: “table”,
width: 200,
height: 200,
text: url
})
})

})

总结canvas方式生成二维码为图片，table方式生成二维码是背景表格形式格