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 相关文章推荐
使用jQuery操作Cookies的实现代码
Oct 09 Javascript
js数组的操作详解
Mar 27 Javascript
JavaScript对象和字串之间的转换实例探讨
Apr 21 Javascript
js借助ActiveXObject实现创建文件
Sep 29 Javascript
js生成随机数之random函数随机示例
Dec 20 Javascript
jQuery基于扩展实现的倒计时效果
May 14 Javascript
AngularJS模块详解及示例代码
Aug 17 Javascript
jQuery ajax 当async为false时解决同步操作失败的问题
Nov 18 Javascript
js断点调试经验分享
Dec 08 Javascript
vue计算属性时v-for处理数组时遇到的一个bug问题
Jan 21 Javascript
Vue 自定义指令实现一键 Copy功能
Sep 16 Javascript
three.js 制作动态二维码的示例代码
Jul 31 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
博士208HAF收音机实习报告
2021/03/02 无线电
php 无法加载mcrypt.dll的解决办法
2013/04/03 PHP
PHP数据过滤的方法
2013/10/30 PHP
一款简单实用的php操作mysql数据库类
2014/12/08 PHP
thinkPHP学习笔记之安装配置篇
2015/03/05 PHP
PHP图像裁剪缩略裁切类源码及使用方法
2016/01/07 PHP
PHP的Yii框架中移除组件所绑定的行为的方法
2016/03/18 PHP
laravel 5异常错误:FatalErrorException in Handler.php line 38的解决
2017/10/12 PHP
简短几句jquery代码的实现一个图片向上滚动切换
2011/09/02 Javascript
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
2011/11/30 Javascript
jQuery+CSS实现菜单滑动伸展收缩(仿淘宝)
2013/03/22 Javascript
解析使用js判断只能输入数字、字母等验证的方法(总结)
2013/05/14 Javascript
js对字符的验证方法汇总
2015/02/04 Javascript
JavaScript中调用函数的4种方式代码实例
2015/07/08 Javascript
jQuery针对input的class属性写了多个值情况下的选择方法
2016/06/03 Javascript
微信小程序 WXDropDownMenu组件详解及实例代码
2016/10/24 Javascript
tablesorter.js表格排序使用方法(支持中文排序)
2017/02/10 Javascript
javascript设计模式之策略模式学习笔记
2017/02/15 Javascript
ES6中参数的默认值语法介绍
2017/05/03 Javascript
浅谈express 中间件机制及实现原理
2017/08/31 Javascript
JavaScript选择排序算法原理与实现方法示例
2018/08/06 Javascript
Vue Extends 扩展选项用法完整实例
2019/09/17 Javascript
JavaScript内置对象之Array的使用小结
2020/05/12 Javascript
vant实现购物车功能
2020/06/29 Javascript
vue 解决setTimeOut和setInterval函数无效报错的问题
2020/07/30 Javascript
python实现unicode转中文及转换默认编码的方法
2017/04/29 Python
Python3实现汉语转换为汉语拼音
2019/07/08 Python
Python 继承,重写,super()调用父类方法操作示例
2019/09/29 Python
PyCharm2020.1.2社区版安装,配置及使用教程详解(Windows)
2020/08/07 Python
AmazeUI框架搭建的方法步骤(图文)
2020/08/17 HTML / CSS
Peter Alexander新西兰站:澳大利亚领先的睡衣设计师品牌
2016/12/10 全球购物
收银员岗位职责范本
2015/04/07 职场文书
致三级跳运动员加油稿
2015/07/21 职场文书
2016年情人节广告语
2016/01/28 职场文书
基于JavaScript实现年月日三级联动
2021/06/22 Javascript
JS实现页面炫酷的时钟特效示例
2022/08/14 Javascript