生成二维码需要引入qrcode.js和jquery.min.js

<!DOCTYPE html>
<head>
<title>二维码</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/qrcode.js"></script>
</head>
<body>
<input id="text" type="text" value="www.baidu.com" style="width:200px;" />
<button id="btn" onclick="makeCode()">生成</button><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 : 200,
height : 200
}); function makeCode () {
var elText = document.getElementById("text");
qrcode.makeCode(elText.value);
}
</script>
</body>
</html>

生成二维码功能(js前端)的更多相关文章

  1. 4种方法生成二维码 (js 控制canvas 画出 二维码)

    随着网络的迅速发展 发展 发展,二维码的应用将会越来越多.同时很多只是很平凡的二维码,请拿起你的手 把这个二维码 设计起来吧.下面分享了几个非常好的二维码设计.  二维码原理: 二维条码/二维码可以分 ...

  2. 生成二维码的js以及调用打印插件

    插件: qrcode.js 插件下载网址:http://code.ciaoca.com/javascript/qrcode/ 用法实例: <script type="text/java ...

  3. Vue——前端生成二维码

    与后端生成二维码相比,前端生成二维码更具有灵活性,下面就介绍两种前端生成二维码的方式,两种方式相比之下,vue-qr比qrcode多了一个再中间添加logo的功能. 方式一:qrcode npm np ...

  4. QRCode.js生成二维码

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

  5. react生成二维码

    图片实例: 简介: QRCode.js 是一个生成二维码的JS库.主要是通过获取 DOM 的节点,再通过 HTML5 Canvas 绘制而成,不依赖任何库. 用法: 1. 在项目中引入qrcode.m ...

  6. Android实例-实现扫描二维码并生成二维码(XE8+小米5)

    相关资料: 第三方资料太大没法写在博文上,请下载CSDN的程序包. 程序包下载: http://download.csdn.net/detail/zhujianqiangqq/9657186 注意事项 ...

  7. java小技术之生成二维码

    把我们需要的链接或者内容生成二维码其实是一件非常容易的事情,有很多办法可以实现,这里我们采用JS方法生成. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTM ...

  8. jquery生成二维码并实现图片下载

    1.引入jquery的两个js文件 <script src="../scripts/erweima/jquery-1.10.2.min.js"></script& ...

  9. java生成二维码,读取(解析)二维码图片

    二维码分为好多种,我们最常用的是qrcode类型的二维码,以下有三种生成方式以及解析方式: 附所需jar包或者js地址 第一种:依赖qrcode.jar import java.awt.Color; ...

随机推荐

  1. kali修改更新源及更新

    进入源文件进行修改 leafpad /etc/apt/sources.list (其实系统本身就自带了更新源,去掉其注释也是可以的,现在官方源的下载速度也还ok,下面的三选一亦可) #kali官方源 ...

  2. C++入门经典-例2.14-使用移位运算

    1:代码如下: // 2.14.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> usin ...

  3. Uep查询语句总结

    今天没事干总结一下uep查询语句: 第一种方法: 注意在实体写上对应的构造方法 package com.haiyisoft.entity.wz; import java.math.BigDecimal ...

  4. Spring配置多个数据源,并实现数据源的动态切换转载)

    1.首先在config.properties文件中配置两个数据库连接的基本数据.这个省略了 2.在spring配置文件中配置这两个数据源: 数据源1 <!-- initialSize初始化时建立 ...

  5. JavaEE-实验三 Java数据库高级编程

    该博客仅专为我的小伙伴提供参考而附加,没空加上代码具体解析,望各位谅解 1.在MySQL中运行以下脚本 CREATE DATABASE mydatabase; USE mydatabase; CREA ...

  6. Dart 基本语法

    ?? // 如果b为null则赋值,否则保持原样 b ??= value; 级联符号.. querySelector('#confirm') // Get an object. ..text = 'C ...

  7. Visual Studio 2017 远程调试

    当你将.NET程序发布到不同机子时候,想要进行调试,但机子不足以安装VS或安装VS麻烦,可以考虑使用远程调试,这里以C#项目为例,asp.net方法略有不同 原理: 首先安装VS远程调试工具,有俩种安 ...

  8. MySQL 常用工具sysbench/fio/tpcc等测试

    为什么要压力测试采购新设备,评估新设备性能开发新项目,评估数据库容量新系统上线前,预估/模拟数据库负载更换数据库版本,评估性能变化 关注指标  CPU %wait,%user,%sys 内存 只内存读 ...

  9. 深入浅出JavaScript(中文版)__莫里森 初读笔记

    创建变量,使用关键字var; 创建常量,使用关键字const; 大驼峰用于对象,小驼峰用于变量和函数. 在试图相加数字时意外做了字符串相连,是种常见的JavaScript错误.如果想做数字相加,请确定 ...

  10. 利用jquery的淡入淡出函数(fadeIn和fadeOut)--实现轮播

    首先说下,我在网上找的例子全是用的UL 实现,其实大可不必,只要是能包含img标签的HTML标签都可以做轮播效果.利用jquery的淡入淡出函数(fadeIn和fadeOut).废话也不多说,边上代码 ...