js通过codeURL画二维码
一、函数封装
//生成微信二维码
function xyqrcode(options) {
var settings = {
dom:'',
render: 'canvas', //生成二维码的格式还有image、div
ecLevel:"H",
text:"",
background:"#ffffff",
fill:"#333333", //二维码纹路的颜色
fontcolor:"#ff9818",
fontname:"Ubuntu",
image:{},
label:"",
mPosX:0.5, //图片在X轴的位置
mPosY:0.5, //图片在X轴的位置
mSize:0.27, //图片大小
minVersion:10,
mode:4,
quiet:1,
radius:1,
size:400
};
if (options) {
$.extend(settings, options);//options对象跟settings比较,相同的就替换,没有的就添加 }
if(settings.dom.length==0){
window.console.log("Error: dom empty!");
return;
}
if(settings.url.length==0){
window.console.log("Error: url empty!");
return;
}
settings.text=settings.url; //在qrcode生成二维码的地址是text。这里就把url赋值给text
$(settings.dom).qrcode(settings); }
二、调用
<div id="code"></div>
$(document).ready(function(){
var options={};
options.url=codeUrl; //二维码的链接
options.dom="#code";//二维码生成的位置
options.image=$('#img-buffer');//图片id
// options.render="canvas";//设置生成的二维码是canvas格式,也有image、div格式
options.render="image";//设置生成的二维码是canvas格式,也有image、div格式
xyqrcode(options);
});
js通过codeURL画二维码的更多相关文章
- jquery.qrcode.min.js(支持中文转化二维码)
详情请看:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/jqueryqrcodeminjs/ 今天还是要讲一下关于二维码的知识,前 ...
- vue 画二维码
首先安装一下相关的插件 qrcode2 npm install --save qrcode2 然后在需要画二维码的页面引入一下 import QRCode from 'qrcode2' 最后在meth ...
- js将网址转为二维码并下载图片
将一个网址转为二维码, 下面可以添加文字, 还提供下载功能 利用的是 GitHub上面的qrcode.js 和canvas <!DOCTYPE html> <html> < ...
- (转)js jquery.qrcode生成二维码 带logo 支持中文
场景:公司最最近在开发二维码支付业务,所以需要做一个html5中的二维码生成和部署! 前天用js生成二维码,节省服务器资源及带宽 原版jquery.qrcode不能生成logo,本文采用的是修改版 1 ...
- js将url转换二维码
二维码生成库 qrcode.js /*from tccdn minify at 2014-6-4 14:59:43,file:/cn/c/c/qrcode.js*/ /** * @fileovervi ...
- qrcode.js的识别解析二维码图片和生成二维码图片
qrcode只通过前端就能生成二维码和解析二维码图片, 首先要引入文件qrcode.js,下载地址为:http://static.runoob.com/download/qrcodejs-04f46c ...
- vue2.0 引用qrcode.js实现获取改变二维码的样式
vue代码 <template> <div class="qart"> <div id="qrcode" ref="qr ...
- 使用js生成条形码以及二维码
一.用js生成条形码这种业务场景不是很常见的,最近刚好又接到这种需求 Google一下,发现github还真有这方面的轮子,感谢github,省去了我们很多造轮子的过程, 好了言归正传,首先引入jsb ...
- js生成和下载二维码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
随机推荐
- HDU 1754——I Hate It——————【线段树单点替换、区间求最大值】
I Hate It Time Limit:3000MS Memory Limit:32768KB 64bit IO Format:%I64d & %I64u Submit St ...
- 在 UWP 应用中创建、使用、调试 App Service (应用服务)
在 Windows 10 中微软为 UWP 引入了 App Service (即应用服务)这一新特性用以提供应用间交互功能.提供 App Service 的应用能够接收来自其它应用传入的参数进行处理后 ...
- 解决npm install安装慢的问题
国外镜像会很慢 可用 get命令查看registry npm congfig get registry 原版结果为 http://registry.npmjs.org 用set命令换成阿里的镜像就可以 ...
- Spring mvc框架下使用kaptcha生成验证码
1.下载jar包并导入. kaptcha-2.3.2.jar 2.spring 配置文件 applicationContext.xml. <bean id="captchaProduc ...
- python数据类型(数字\字符串\列表)
一.基本数据类型——数字 1.布尔型 bool型只有两个值:True和False 之所以将bool值归类为数字,是因为我们也习惯用1表示True,0表示False. (1)布尔值是False的各种情况 ...
- scss-!default默认变量
在变量赋值之前, 利用!default为变量指定默认值. 也就是说,如果在此之前变量已经赋值,那就不使用默认值,如果没有赋值,则使用默认值. 代码实例如下: $content: "antzo ...
- Linux - centos 7 mysql安装
安装 CentOS Linux release 7.1.1503 (Core)下载地址链接:https://pan.baidu.com/s/1c2rWsbm 密码:5nrt #yum -y insta ...
- html5 填表 表单 input output 与表单验证
1.<output> Js计算结果 <form oninput="res.value = num1.valueAsNumber*num2.valueAsNumber ...
- gsap
TweenMax借助于css,轻量级的js库 下面是简单的demo <!DOCTYPE html> <html lang="en"> <head> ...
- html中通过移除空格的方法来解决浏览器上的留白间距该怎么理解?
今天在切图的时候,碰到一个兼容性的问题,很幸运最后通过张金鑫老师的文章解决了这个问题!但在阅读张老师文章的时候,我有个地方不明白,在网上查了下也没找到我想要的答案,后来自己想了半天好像是这么回事,现在 ...