analyticCode
功能描述
利用qrcode.js制作的二维码解析器,可以用该插件制作长按识别二维码功能
依赖的插件
无依赖插件
安装
无需安装
快速使用
1,扩展了移动端‘长按触发事件’
//扩展移动端长按事件
$.fn.longPress = function (fn) {
let timer = null;
let $this = this;
for (let i = 0; i < $this.length; i++) {
$this[i].addEventListener('touchstart', function (event) {
timer = setTimeout(fn, 600);
}, false);
$this[i].addEventListener('touchend', function (event) {
clearTimeout(timer);
}, false);
}
}
2,添加了触发事件的动作‘弹出框’
$('#showImg').longPress(function(){
let str = '
'+
'识别二维码'+
'
弹出地址
'+
'当前窗口打开地址
'+
'
新窗口打开地址
'+
'';
$('#analytic').append(str);
});
3,添加了弹出框不同参数的点击事件
function alertChange(param) {
if (param === 1) {
getUrl(document.getElementById('showImg'), 'img-url');
} else if (param === 2) {
analyticCode.getUrl('img-url', document.getElementById('showImg'), function(url) {
alert(url);
});
} else if (param === 3) {
analyticCode.getUrl('img-url', document.getElementById('showImg'), function(url) {
window.location.href = url;
});
} else if (param === 4) {
analyticCode.getUrl('img-url', document.getElementById('showImg'), function(url) {
window.open(url);
});
} else {
return;
}
$('#addDiv').remove();
}
analyticCode.getUrl(param,e,function(url1,url2){
e.nextElementSibling.innerHTML = url1;
e.previousElementSibling.src = url2;
});
特别说明
param:是解析形式,分别有‘img-url’(长按解析二维码),‘file-url’(上传图片解析二维码)
e:是当前元素,长按时为当前图片,上传时为input
callback:是解析后将解析的内容在函数中返回,如果是上传解析,同时会返回上传图片的地址,在callback中操作当前页面