基本使用方法:

1、首先在页面中加入jquery库文件和qrcode插件。

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

2、在页面中需要显示二维码的地方加入以下代码:

<div id="code"></div> 

3、调用qrcode插件。

qrcode支持canvas和table两种方式进行图片渲染,默认使用canvas方式,效率最高,当然要浏览器支持html5。直接调用如下:

$('#code').qrcode("http://www.helloweba.com"); //任意字符串 

您也可以通过以下方式调用:

$("#code").qrcode({     render: "table", //table方式     width: 200, //宽度     height:200, //高度     text: "www.helloweba.com" //任意内容 }); 

这样就可以在页面中直接生成一个二维码,你可以用手机“扫一扫”功能读取二维码信息。

但是你会发现不支持中文二维码 是因为编码格式有冲突,这样解决把这段js写进去:


 <script type="text/javascript">
        function utf16to8(str) {
            var out, i, len, c;
            out = "";
            len = str.length;
            ; i < len; i++) {
                c = str.charCodeAt(i);
                if ((c >= 0x0001) && (c <= 0x007F)) {
                    out += str.charAt(i);
                } else if (c > 0x07FF) {
                    ) & 0x0F));
                    ) & 0x3F));
                    ) & 0x3F));
                } else {
                    ) & 0x1F));
                    ) & 0x3F));
                }
            }
            return out;
        }
        $(function () {
            jQuery('#output').qrcode(utf16to8("今天天气不错"));
        })
    </script>  

渲染的时候也可以这样输出:

$("#output").qrcode({
// render: "table", //table方式 (可以选择渲染方式,一般默认为为canvas比较好)
width: 80, //宽度
height: 80, //高度
text: utf16to8("你好啊") //任意内容
});

jquery.qrcode生成二维码支持中文的更多相关文章

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

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

  2. 使用jquery.qrcode生成二维码支持logo,和中文

    /* utf.js - UTF-8 <=> UTF-16 convertion * * Copyright (C) 1999 Masanao Izumo <iz@onicos.co. ...

  3. C# Qrcode生成二维码支持中文,带图片,带文字 2015-01-22 15:11 616人阅读 评论(1) 收藏

    1.下载Qrcode库源码,下载地址:http://www.codeproject.com/Articles/20574/Open-Source-QRCode-Library 2.打开源码时,部分类库 ...

  4. Qrcode生成二维码支持中文,带图片,带文字

    1.下载Qrcode库源码, 下载地址:http://www.codeproject.com/Articles/20574/Open-Source-QRCode-Library2.打开源码时, 部分类 ...

  5. 使用jquery-qrcode在页面上生成二维码,支持中文

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

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

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

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

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

  8. (转)js jquery.qrcode生成二维码 带logo 支持中文

    场景:公司最最近在开发二维码支付业务,所以需要做一个html5中的二维码生成和部署! 前天用js生成二维码,节省服务器资源及带宽 原版jquery.qrcode不能生成logo,本文采用的是修改版 1 ...

  9. 使用jquery.qrcode生成二维码(转)

    jQuery 的 qrcode 插件就可以在浏览器端生成二维码图片. 这个插件的使用非常简单: 1.首先在页面中加入jquery库文件和qrcode插件. <script type=" ...

随机推荐

  1. exec族

    在之前我们已经知道用fork创建子进程后执行的是和父进程相同的程序(但有可能执行不同的代码分支),子进程往往要调用一种exec函数以执行另一个程序.当进程调用一种exec函数时,该进程的用户空间代码和 ...

  2. lintcode-130-堆化

    130-堆化 给出一个整数数组,堆化操作就是把它变成一个最小堆数组. 对于堆数组A,A[0]是堆的根,并对于每个A[i],A [i * 2 + 1]是A[i]的左儿子并且A[i * 2 + 2]是A[ ...

  3. 6for Java

    class Check{ public boolean validate(String name,   String password){  if(name.equals("xuzhaoni ...

  4. lnmp1.4,400,500,错误

    Thinkphp5或其他主流框架,入口文件未放在根目录下,比如Thinkphp5 入口文件放在/public/index.php vhost需要指向/public目录 一键安装包通常会报 open_b ...

  5. Android开发工具常用快捷键大全

    Android开发中常用的开发工具有android studio和eclipse两种,下面小编整理了一些这两种开发工具中常用的快捷键,使用这些快捷键,你的android编程将事半功倍. android ...

  6. css引入特殊字体

    http://www.fontsquirrel.com/tools/webfont-generator        ttf格式的字体转换成其他格式的字体   css引入特殊字体建议只是用英文字体,中 ...

  7. HDU 6153 A Secret(扩展KMP模板题)

    A Secret Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 256000/256000 K (Java/Others) Total ...

  8. 【题解】NOI2015寿司晚宴

    想好久啊+不敢写啊……但果然人还是应当勇敢自信,只有坚定地去尝试,才会知道最后的结果.1A真的太开心啦,不过好像我的做法还是比较复杂的样子……理解起来应该算是比较容易好懂的类型,大家可以参考一下思路~ ...

  9. Spring源码解析-AutowiredAnnotationBeanPostProcessor

    1.实现了BeanPostProcessor接口,可先看这个接口 ApplicationContext可以在自动检测BeanPostProcessor bean,在它创建完后可以创建任何的bean. ...

  10. Codeforces 937.C Save Energy!

    C. Save Energy! time limit per test 1 second memory limit per test 256 megabytes input standard inpu ...