大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。
Jetbrains全系列IDE稳定放心使用
使用kjua生成二维码
使用方法
在官网下载js文件,在页面中引用即可,原生js实现,不需要引用其他依赖。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="test">
</div>
<script src="kjua-0.9.0.min.js"></script>
<script>
// text:二维码内容
var el = kjua({text: 'http://www.baidu.com'});
document.querySelector('#test').appendChild(el);
</script>
</body>
</html>
效果如下:
也可用jQuery方式生成(需要引入jQuery)。
$('#test').kjua({text: 'http://www.baidu.com'});
当然也可以在二维码中间加入图片logo或文字,下面是所有可选参数(不必设置所有参数,设置需要的即可)。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
#img-buffer {
display: none;
}
</style>
</head>
<body>
<div id="test">
</div>
<!-- 用于保存二维码中间图片 -->
<img src="icon5.png" id="img-buffer">
<script src="kjua-0.9.0.min.js"></script>
<script>
// 二维码中间的图片
var img=window.document.getElementById("img-buffer")
var el = kjua({
// render method: 'canvas', 'image' or 'svg'
// 绘制方式
render: 'image',
// render pixel-perfect lines
crisp: true,
// minimum version: 1..40
minVersion: 1,
// error correction level: 'L', 'M', 'Q' or 'H'
ecLevel: 'L',
// size in pixel
// 大小
size: 200,
// pixel-ratio, null for devicePixelRatio
ratio: null,
// code color
fill: '#333',
// background color
back: '#fff',
// content
text: 'http://www.baidu.com',
// roundend corners in pc: 0..100
// 二维码圆角
rounded: 100,
// quiet zone in modules:二维码周围空白大小
quiet: 0,
// modes: 'plain', 'label' or 'image'
// 样式:plain:默认
//label:中间显示文字,需要设置label参数
//image:中间显示图片,需要设置image参数
mode: 'image',
// label/image size and pos in pc: 0..100
// 中间图片或文字大小
mSize: 10,
// 中间图片或文字位置
mPosX: 50,
mPosY: 50,
// label 字体中间的文字
label: 'label',
// 字体
fontname: 'sans',
fontcolor: '#333',
// image element
image: img
});
document.querySelector('#test').appendChild(el);
</script>
</body>
</html>
效果如下:
图片样式
文字样式
兼容ie
由于ie不支持Object.assign(),所有需要在使用插件之前声明如下方法:
if (typeof Object.assign != 'function') {
Object.assign = function(target) {
'use strict';
if (target == null) {
throw new TypeError('Cannot convert undefined or null to object');
}
target = Object(target);
for (var index = 1; index < arguments.length; index++) {
var source = arguments[index];
if (source != null) {
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
}
return target;
};
}
发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/180925.html原文链接:https://javaforall.cn
【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛
【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...