QRCode.js：跨浏览器的javascript二维码生成库，支持html5的Canvas画布，没有任何依赖。

Github 地址：https://github.com/davidshimjs/qrcodejs

QRCode+jQUery
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">
<head>
    <title>Javascript 二维码生成库：QRCode</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
    <script type="text/javascript" src="http://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://static.runoob.com/assets/qrcode/qrcode.min.js"></script>
</head>
<body>
    <input id="text" type="text" value="https://www.cnblogs.com/MakeView660/" style="width:80%" /><br />
    <div id="qrcode" style="width:100px; height:100px; margin-top:15px;"></div>

<script type="text/javascript">
        var qrcode = new QRCode(document.getElementById("qrcode"), {
            width : ,
            height : 
        });

function makeCode () {      
            var elText = document.getElementById("text");
            
            if (!elText.value) {
                alert("Input a text");
                elText.focus();
                return;
            }
            
            qrcode.makeCode(elText.value);
        }
        
        makeCode();
    
        $("#text").
            on("blur", function () {
                makeCode();
            }).
            on("keydown", function (e) {
                ) {
                    makeCode();
                }
            });
    </script>
</body>
</html>

其它设置：

 HTML Code 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
  
<div id="qrcode"></div>
<script type="text/javascript">
    var qrcode = new QRCode(document.getElementById("qrcode"), {
        text: "https://www.cnblogs.com/MakeView660/",
        width: 128,
        height: 128,
        colorDark : "#000000",
        colorLight : "#ffffff",
        correctLevel : QRCode.CorrectLevel.H
    });
</script>

qrcode.clear();                             // clear the code.
qrcode.makeCode("http://www.baidu.com");    // make another code.

二维码生成：使用 JavaScript 库QRCode.js生成二维码的更多相关文章

  1. 二维码解析：使用 JavaScript 库reqrcode.js解析二维码

    上次使用QRCode.js可以来生成二维码,但是我没有找到有文档说明可以对存在的二维码进行扫描解析其中的内容. 幸亏查找到了可行的解决方案,而且很好使哦!就是reqrcode.js 地址:https: ...

  2. QRCode.js生成二维码

    QRCode的GitHub地址: https://github.com/KeeeX/qrcodejs 该版本解决了主版本(https://github.com/davidshimjs/qrcodejs ...

  3. 【QRcode二维码】：使用JS前端插件QRcode.js生成二维码

    1.先简单说一下jquery-qrcode,这个开源的三方库(可以从https://github.com/jeromeetienne/jquery-qrcode 获取), qrcode.js 是实现二 ...

  4. qrcode.js生成二维码因字符串过长而报错

    前端使用qrcode.js生成二维码的时候.有时候是会出现 qrcode length overflow (1632>1056) 目前使用的有效的解决办法是重新下载新版的qrcode.js 下载 ...

  5. qrcode.js生成二维

    使用到qrcode.js生成二维码 pako.js压缩字符串:https://github.com/nodeca/pako 参照代码如下: <!DOCTYPE HTML PUBLIC " ...

  6. 解决在页面中无法获取qrcode.js生成的base64的图片

    应用场景 生成带二维码的推广海报图片 旧方法: 将用户自己的推广连接先通过qrcode.js生成二维码,然后再用后台返回的一张背景图片和二维码通过canvas绘制成一张海报. 问题 在部分安卓手机上获 ...

  7. jquery.qrcode.js生成二维码（前端生成二维码）

    官网地址:http://jeromeetienne.github.io/jquery-qrcode/ 第一步引入插件: <script type='text/javascript' src='h ...

  8. QRCode.js 生成二维码

    QRCode.js 是一个用于生成二维码图片的插件. github地址 在线实例 实例预览 基础示例 实例预览 API 接口 使用方法 载入 JavaScript 文件 <script src= ...

  9. 利用vcard和qrcode.js生成二维码导入联系人

    vCard是一种容许交换个人信息的数据规范,vCard数据格式的标识符是VCARD,vCard数据格式行是: 类型 [;参数]:值,具体的介绍百度都有,我们可以通过vcard来进行通讯录的保存,名片的 ...

随机推荐

  1. myeclipse开发安装C++

    经过若干google之后(百度就不用说了),又经过了若干尝试,终于用最简单的步骤配起来了.(一些比较旧的文章写的太繁杂了,随着各个工具的升级,搭建环境很简单了).        前言:写博客不是为了炫 ...

  2. [译]Godot系列教程六 - 简单的二维游戏

    Pong Godot自带的Demo中有大量更复杂的示例,但这款叫"Pong"的游戏可以对2D游戏的基本特性做一个介绍. 静态资源 本文所用到的一些资源文件:http://files ...

  3. Java IO流学习

    Java IO流学习 Java流操作有关的类或接口: Java流类图结构: 流的概念和作用 流是一组有顺序的,有起点和终点的字节集合,是对数据传输的总称或抽象.即数据在两设备间的传输称为流,流的本质是 ...

  4. java 、HashMap 和单例

    前段时间在项目中遇到一个问题.当多个系统同时运行时,大部分系统能够良好运转,部分却卡死在了启动界面.以下是我解决该问题的步骤和总结:   1.复现问题.重新走了一遍出问题的过程,发现问题的确存在.说明 ...

  5. VS2008中设置字体大小和添加显示行号

    1.字体设置 菜单->工具->选项->环境->字体和颜色 在字体那一栏可以选字体,VC6.0默认的字体是Fixedsys,字体大小你可以设为12,就与VC6.0的一样的字体了. ...

  6. DBExportDoc V1.0 For MySQL

    win7系统下或者64位系统下,安装完mysql-connector-odbc驱动后,直接进入:管理工具--数据源(ODBC),点击添加不显示该驱动,该问题解决如下:进入dos命令行,输入:C:\Us ...

  7. [spark] spark 特性、简介、下载

    [简介] 官网:http://spark.apache.org/ 推荐学习博客:http://dblab.xmu.edu.cn/blog/spark/ spark是一个采用Scala语言进行开发,更快 ...

  8. C++ operator关键字详解

    C++中的operator主要有两个作用,一是操作符的重载,一是自定义对象类型的隐式转换. 类型转换操作符(type conversion operator)是一种特殊的类成员函数,它定义将类类型值转 ...

  9. 1、QT分析之QApplication的初始化

    原文地址:http://blog.163.com/net_worm/blog/static/1277024192010097430321/ 在开始分析之前交代一下,一是分析的QT在Window平台实现 ...

  10. 常用包管理三类工具：dpkg、apt和aptitude

    常用的包管理包含三类工具:dpkg.apt和aptitude.人们总是对前面的两个工具用得比较多,而对 aptitude 用得比较少,事实上 aptitude 是很强大的. 在这里,对这三个工具做一点 ...