今天我要和大家分享的是利用qrcode来生成二维码。

首先要使用qrcode就需要引用文件，我这边用的是1.7.2版本的jquery加上qrcode

<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.qrcode.min.js"></script>

引入文件后我们就可以生成一个I love you的二维码。

代码如下：

$(function(){
$("#canvasqrcode").qrcode("I love you!");

});

在body里面增加<div id="canvasqrcode"></div>就大功告成了

要是调整大小可以用以下代码width,height后面默认是px写死在插件中，当然可以调整下插件。

$("#miniCodeOne").qrcode({width: 64,height: 64,text:"I love you!"});

另外也可以控制渲染方式

用下面代码render可以选择table或者canvas来进行渲染

$("#qrcode").qrcode({render: "table",text:"this plugin is
great"});

但是汉字支持不够我们需要进行转换

以下是函数

;function toUtf8(str) {
var out, i, len, c;
out = "";
len = str.length;
for(i = 0; i < len; i++) {
c = str.charCodeAt(i);
if ((c >= 0x0001) && (c <= 0x007F)) {
out += str.charAt(i);
} else if (c > 0x07FF) {
out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
} else {
out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
}
}
return out;
}

下面贴上我的网页代码

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.qrcode.min.js"></script>
<script type="text/javascript">
;function toUtf8(str) {
var out, i, len, c;
out = "";
len = str.length;
for(i = 0; i < len; i++) {
c = str.charCodeAt(i);
if ((c >= 0x0001) && (c <= 0x007F)) {
out += str.charAt(i);
} else if (c > 0x07FF) {
out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
} else {
out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
}
}
return out;
}
$(function(){
// render: "table", //table方式，canvas
$("#qrcode").qrcode({render: "table",text:"this plugin is

great"});
$("#canvasqrcode").qrcode("I love you!");
$("#chinaCode").qrcode(toUtf8("中国我爱你"));
$("#miniCode").qrcode({width: 64,height: 64,text:toUtf8("中国我爱

你")});
$("#miniCodeOne").qrcode({width: 64,height: 64,text:toUtf8("中国

我爱你")});
$("#colorCodeOne").qrcode({
text: "http://www.gbtags.com",
width: 260,
height: 260,
foregroun: '#FF0000'
});
});
</script>
</head>
<body>
<div id="qrcode"></div>
<br/><br/><br/><br/><br/><br/>
<div id="canvasqrcode"></div>
<br/><br/><br/><br/><br/><br/>
<div id="chinaCode"></div>
<br/><br/><br/><br/><br/><br/>
<div id="miniCode"></div>
<br/><br/><br/><br/><br/><br/>
<div id="miniCodeOne"></div>
<br/><br/><br/><br/><br/><br/>
<div id="colorCodeOne"></div>
</body>
</html>

qrcode生成二维码插件的更多相关文章

  1. 使用jquery.qrcode生成二维码及常见问题解决方案

    转载文章  使用jquery.qrcode生成二维码及常见问题解决方案 一.jquery.qrcode.js介 jquery.qrcode.js 是一个纯浏览器 生成 QRcode 的 jQuery ...

  2. 使用jquery.qrcode生成二维码实现微信分享功能

    前言: 最近有个这样的需求,在pc端的商品详情页增加分享功能. 微博分享.QQ好友分享.QQ空间分享这些都很常见.但是微信分享我还没有手动写过(以前改过). 最终效果如下图: 解决方案:使用jquer ...

  3. C# 利用QRCode生成二维码图片

    网上生成二维码的组件是真多,可是真正好用的,并且生成速度很快的没几个,QRCode就是我在众多中找到的,它的生成速度快.但是网上关于它的使用说明,真的太少了,大都是千篇一律的复制粘贴.这是本要用它做了 ...

  4. Qrcode生成二维码的参数总结 及最小尺寸的测试

    Qrcode生成二维码,做过很多实验,探索最小规格的二维码到底是多少尺寸,和最高规格的二维码到底是多大尺寸.现在我总结总结: 有两种思路: 1.生成规格高的二维码,然后压缩到自己想要的尺寸的二维码.这 ...

  5. qrcode 生成二维码

    qrcode 生成二维码 Demo: https://www.hgnulb.cn/freedom/qrcode/qrcode.html qrcodeGithub 地址: https://github. ...

  6. C#Qrcode生成二维码支持中文,带图片，带文字

    C#Qrcode生成二维码支持中文带图片的操作请看二楼的帖子,当然开始需要下载一下C#Qrcode的源码 下载地址 : http://www.codeproject.com/Articles/2057 ...

  7. python_使用qrcode生成二维码

    1.功能 使用qrcode生成二维码 2.代码 #生成二维码: import qrcode #根据url生成二维码 def qrcodeWithUrl(url): img = qrcode.make( ...

  8. QRCode生成二维码，jq QRCode生成二维码，QRCode生成电子名片

    [QRCode官网]http://phpqrcode.sourceforge.net/ PHP QRCode生成二维码 官网下载QRCode源码包,引入源码包中的 qrlib.php . <?p ...

  9. 动态生成二维码插件 jquery.qrcode.js

    前段时间做项目,需要动态生成一个二维码,于是就在网上找了一下发现一个jquery插件jquery.qrcode.js,所以今天就简单说一下这个插件的使用: jquery.qrcode.js是依赖jqu ...

随机推荐

  1. javaScript 基础学习笔记

    边看视频和书记得有点杂. 1.插入JS标签 一种是在文档中插入<script></script>标签.另一种是把javaScript代码放在.js文件中.放在head中如. & ...

  2. T-SQL语句中的转换函数

    书接上回 前面讲了聚合函数.字符串函数 今天一起来看下转换函数 首先是 值类型转换 ),degree) 在C#里面是convert,现在在SQL中也是他,convert(转换类型,被转换列)from ...

  3. wow.js中各种特效对应的类名

    一.(页面在向下滚动的时候,有些元素会产生细小的动画效果.虽然动画比较小,但却能吸引你的注意.) 刚知道wow.js这个插件,之前访问别的网站下拉滚动条会出现各种效果感觉特别神奇,现在自己依葫芦画瓢也 ...

  4. linux下编译安装nginx

    1.首先下载稳定版nginx1.10.2 使用wget命令下载 wget http://nginx.org/download/nginx-1.10.2.tar.gz 2.然后解压 tar -zxvf  ...

  5. [ext4]04 磁盘布局 - Meta Block Groups

    Meta Block Groups,可以翻译为元块组集. 如果不采用Meta Block Groups特性,在每个冗余备份的超级块的后面是一个完整的(包含所有块组描述符的)块组描述符表的备份.如前所述 ...

  6. 清北Day4

    版权声明:如需转载请标明出处,未得到本人许可请勿转载. 今天就可以看到传说中的 数据结构 嘿嘿嘿嘿 都有什么呢 链表 队列 栈 st表 hash 线段树 树链剖分 一.栈: 放出来这个看烂了的图 值得 ...

  7. Scraping_regex

    上面链接爬虫只是能将我们所需的网页下载下来,但是,我们没办法得到我们想要的数据.因此,我们只有URL管理器和URL下载器是不足以组成一个完整的网络爬虫的.我们还需要URL解析器,对数据进行提取. 数据 ...

  8. java集合系列—ArrayList

    ArrayList是工作以来使用频率最高的集合类.以前上课老师说不知道用什么集合类就用ArrayList,好吧,后面就这样了. public class ArrayList<E> exte ...

  9. C#文件下载（适用于各个浏览器）

    1.cs代码 public void DownFile(string filePath ,string fileName ) { // filePath 文件路径 例如:/File/记录.xlsx / ...

  10. Python登录页面及

    写一段代码的流程,先用中文写出流程 #解释器 #编码 #登录,三次登录失败,锁定账户 #文件里保存用户信息 用户名|密码|登录次数 用户名|密码|登录次数 读取内容,r: 文件内容读进内存,read( ...