目录架构：

index.html
<!DOCTYPE>

<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="./js/jquery-3.2.1.min.js"></script>

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

</head>

<body>

<input id="text" type="text" value="http://www.runoob.com" 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 : 100,

	height : 100

});

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) {

		if (e.keyCode == 13) {

			makeCode();

		}

	});

</script>

</body>

</html>
页面效果：



资源文件请访问本人github地址：https://github.com/raind33/HTML5/tree/master/h5js%E7%94%9F%E6%88%90%E4%BA%8C%E7%BB%B4%E7%A0%81

h5之js生成二维码的更多相关文章

  1. js 生成二维码图片

    1.用纯JavaScript实现的微信二维码图片生成器 QRCode.js是javascript实现二维码(QRCode)制作生成库. QRCode.js有着良好的跨浏览器兼容性(高版本使用HTML5 ...

  2. 使用jquery.qrcode.js生成二维码

    通常生成二维码的方式有两种:第一种是java代码的形式,第二种是通过Js方式. 在这里我做个记录,用js生成二维码,可以在官网下载源码:http://jeromeetienne.github.io/j ...

  3. js生成二维码 qrcode

    js生成二维码 QRcode npm 地址 1.安装qrcode //在项目文件夹中执行: npm install --save qrcode //或者,将其全局安装以使用qrcode命令行来保存qr ...

  4. QRCode.js生成二维码

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

  5. js生成二维码以及点击下载二维码

    js生成二维码 jquery.qrcode.js可以快速使用页面生成二维码.但改项目有两个小问题:1.不支持中文:2.不支持二维码中间生成图片. 支持中文的jquery-qrcode jquery.q ...

  6. php--------使用js生成二维码

    php生成二维码有多种方式,可以在JS中,也可以使用php库,今天写的这个小案例是使用JS生成二维码. 其他方式可以看下一篇文章:php--------php库生成二维码和有logo的二维码 网站开发 ...

  7. Java与JS生成二维码

    1.二维码概念 二维码/二维条码是用某种特定的集合图形按一定规律在平面上(二维方向上)分布的黑白相间的图形记录数据符号信息的图片. 黑线是二进制的1,空白的地方是二进制的0,通过1.0这种数据组合用于 ...

  8. js生成二维码的jquery组件–qrcode

    js生成二维码的jquery组件–qrcode 2015/01/30 / 2508 VIEWS / JAVASCRIPT, JQUERY 有一些耗cpu的计算,完全可以在客户端上计算,比如生成二维码. ...

  9. java和js生成二维码

    1. java生成二维码 1.1 依赖jar包配置(使用maven依赖) <dependency> <groupId>com.google.zxing</groupId& ...

随机推荐

  1. Netty 4.1 Getting Start （翻译） + Demo

    一.先来官方入门页面的翻译(翻译不好请多包涵) 入门 本章以简单的例子来介绍Netty的核心概念,以便让您快速入门.当您阅读完本章之后,您就能立即在Netty的基础上写一个客户端和一个服务器. 如果您 ...

  2. Codeforce使用方式

    突然想起写这个东西,因为当时新手的我,完全不知道cf的比赛该如何参加,因为近期没有比赛,所以我会在有比赛时截图再写这个博客,我会在2018/5/10号之前完成,想看的先关注一下.

  3. emptyDir与hostPath

    目录 Volume类型 emptyDir hostPath Volume类型 volume是kubernetes Pod中多个容器访问的共享目录.volume被定义在pod上,被这个pod的多个容器挂 ...

  4. 加减乘除工具类BigDecimalUtil

    场景:为毛要用BigDecimal这个类来实现加减乘除呢?我不说其他的,你去用小数乘小数,除小数就知道.话不多说,老规矩,开箱即用. BigDecimalUtil.java package com.m ...

  5. BigDecimal最基础用法【转】

    BigDecimal最基础用法 用字符串生成的BigDecimal是不会丢精度的. 简单除法. public class DemoBigDecimal { public static void mai ...

  6. 同步、异步、阻塞、非阻塞与future

    前言 随着移动互联网的蓬勃发展,手机App层出不穷,其业务也随之变得错综复杂.针对于开发人员来说,可能之前的一个业务只需要调取一次第三方接口以获取数据,而如今随着需求的增加,该业务需调取多个不同的第三 ...

  7. PHP7 学习笔记（三）关于PHP7如何安装调试工具Xdebug扩展以及Zephir的问题

    前言: 1.自己摸索安装 2.快速安装 安装这个扩展是由于Zephir 编译不能始终通过,迫不得已啊,使用Zephir写扩展,总是出现以下错误: www@ubuntu1:~/phalcon-zephi ...

  8. Windows 与 Linux下关于端口不能访问的问题

    自己写的一个HTTP文件服务器,在端口 50000上监听HTTP连接请求,在Eclipse里面将程序正常地启动之后,能够在自己的机器上(Eclipse启动该程序的机器上)访问 50000端口,即Fil ...

  9. HTML5的manifest 本地离线缓存

    下面直接放测试代码: index.html <!DOCTYPE html> <html manifest="m.manifest"> <head> ...

  10. Java EE之分页器设计

    由于数据库实训的课程设计,在做项目过程中,需要使项目更加规范的结构和各层间责任分离.无疑地,分页器是其中之一. 1. 本文仅陈述分页器如何实现,关于分页器的其他概念,请自行搜索其他网络资源. 2. 关 ...