工作中查资料偶然发现一个网站 自我感觉比bootstrap好用 贴上网址：http://www.pintuer.com/
下载解压之后，可以看到这几个文件：
起步中有一个respond.js文件根据实际情况确定是否下载
插件中有一个生成二维码的插件，下载下来
解压后得到一个
文件
新建HTML文件 将这些文件引入
引用顺序 jQuery.js在pintuer.js之前引用，如有自定义的CSS或JS，请在pintuer.css及pintuer.js之后引用，同时为了IE8下正常使用响应式，自定义的CSS文件应在respond.js之前引用。
然后下面是代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="renderer" content="webkit">
<link rel="stylesheet" href="pintuer/pintuer.css" />
<script type="text/javascript" src="pintuer/jquery.js"></script>
<script type="text/javascript" src="pintuer/pintuer.js"></script>
<script type="text/javascript" src="pintuer/respond.js"></script>
<script type="text/javascript" src="pintuer/jquery.qrcode.min.js"></script>
<title>生成二维码</title>
</head>
<body>
<input type="button" value="生成二维码" onclick="dian()"/>
<div id="code"></div>
</body>
<script type="text/javascript">
function dian()
{
var a = $("#code").html();
if(a=="")
{
//qrcode支持canvas和table两种方式进行图片渲染，默认使用canvas方式，效率最高，当然要浏览器支持html5。
//1、任意字符串方式
$(‘#code‘).qrcode("http://www.pintuer.com");
//2、Json方式
// $("#code").qrcode({
// render: "canvas", //table方式
// width: 200, //宽度
// height:200, //高度
// text: "www.pintuer.com" //任意内容
// });
}
else
{
}
}
</script>
</html>
在代码中加一个点击事件来调用，加了一个判断来控制，不然会一直生成同一个二维码
效果如图：
时间： 2024-10-18 02:18:06