jQuery实现二维码扫描功能


Posted in Javascript onJanuary 09, 2017

二维码:利用图形模拟二进制0、1的概念,达到存储少量数据的功能,一般移动端浏览器解析出二维码里面隐藏的url数据会自动进行跳转,常见的支付宝、微信扫描登陆就是利用该原理

Jquery二维码的实现:jquery.qrcode.min.js插件

HTML正文:

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

<input type="button" value="二维码" id="bt" />: <span id="count"></span>
<br>
<div id="code"></div>
<br>

Javascript操作代码:

var i=0;
$("#bt").click(function() {

 $("#count").text(++i);
 $("#code").text(""); //初始化二维码的位置

 jQuery('#code').qrcode({
  render : "canvas",//也可以替换为table
  width : 100,
  height : 100,
  text : "http://www.baidu.com" //二维码内置内容,如果时URL形式一般浏览器会自动加载
 });
});

效果:

jQuery实现二维码扫描功能

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript 布尔型分析
Dec 22 Javascript
对Jquery中的ajax再封装,简化操作示例
Feb 12 Javascript
JavaScript中最简洁的编码html字符串的方法
Oct 11 Javascript
js实现上传图片预览的方法
Feb 09 Javascript
一些实用性较高的js方法
Apr 19 Javascript
小白谈谈对JS原型链的理解
May 03 Javascript
JavaScript中的冒泡排序法
Aug 03 Javascript
基于jQuery实现数字滚动效果
Jan 16 Javascript
xmlplus组件设计系列之按钮(2)
Apr 26 Javascript
浅谈VUE单页应用首屏加载速度优化方案
Aug 28 Javascript
vue页面切换过渡transition效果
Oct 08 Javascript
使用npm命令提示: 'npm' 不是内部或外部命令,也不是可运行的程序的处理方法
May 14 Javascript
详解Jquery 遍历数组之$().each方法与$.each()方法介绍
Jan 09 #Javascript
详解js产生对象的3种基本方式(工厂模式,构造函数模式,原型模式)
Jan 09 #Javascript
基于jQuery实现滚动刷新效果
Jan 09 #Javascript
用jQuery实现优酷首页轮播图
Jan 09 #Javascript
AngularJS实现表单验证功能
Jan 09 #Javascript
AngularJS表单基本操作
Jan 09 #Javascript
AngularJS Controller作用域
Jan 09 #Javascript
You might like
随机头像PHP版
2006/10/09 PHP
PHP提取中文首字母
2008/04/09 PHP
js宝典学习笔记(上)
2007/01/10 Javascript
jquery延迟加载外部js实现代码
2013/01/11 Javascript
js跨域访问示例(客户端/服务端)
2014/05/19 Javascript
jQuery晃动层特效实现方法
2015/03/09 Javascript
jQuery on()方法使用技巧详解
2015/04/16 Javascript
使用AngularJS编写较为优美的JavaScript代码指南
2015/06/19 Javascript
AngularJs Understanding the Model Component
2016/09/02 Javascript
jQuery+CSS3实现四种应用广泛的导航条制作实例详解
2016/09/17 Javascript
Jquery UI实现一次拖拽多个选中的元素操作
2020/12/01 Javascript
jQuery Mobile和HTML5开发App推广注册页
2016/11/07 Javascript
BootStrap Tooltip插件源码解析
2016/12/27 Javascript
详解Jquery EasyUI tree 的异步加载(遍历指定文件夹,根据文件夹内的文件生成tree)
2017/02/11 Javascript
基于javascript的异步编程实例详解
2017/04/10 Javascript
JavaScript常见JSON操作实例分析
2018/08/08 Javascript
vue初始化动画加载的实例
2018/09/01 Javascript
详解javascript 变量提升(Hoisting)
2019/03/12 Javascript
Vue项目从webpack3.x升级webpack4不完全指南
2019/04/28 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
2019/11/01 Javascript
Vue v-for循环之@click点击事件获取元素示例
2019/11/09 Javascript
15分钟学会vue项目改造成SSR(小白教程)
2019/12/17 Javascript
使用webpack/gulp构建TypeScript项目的方法示例
2019/12/18 Javascript
python读取html中指定元素生成excle文件示例
2014/04/03 Python
一条命令解决mac版本python IDLE不能输入中文问题
2018/05/15 Python
Python实现Dijkstra算法
2018/10/17 Python
python 提取tuple类型值中json格式的key值方法
2018/12/31 Python
python pandas写入excel文件的方法示例
2019/06/25 Python
CSS的pointer-events属性详细介绍(作用和注意事项)
2014/04/23 HTML / CSS
HTML5 Canvas画线技巧——实现绘制一个像素宽的细线
2013/08/02 HTML / CSS
猎人靴英国官网:Hunter Boots
2017/02/02 全球购物
美国最大的家庭鞋类零售商之一:Shoe Carnival
2017/10/06 全球购物
小学生作文评语
2014/04/18 职场文书
同学聚会通知短信
2015/04/20 职场文书
幼儿园音乐教学反思
2016/02/18 职场文书
用Python创建简易网站图文教程
2021/06/11 Python