jquery二维码

Posted 2020-09-04 小码飞驰

这里可以调用一个jq-qrcode库，然后根据参数往里面传内容即可，本人当时做的是一个名片系统，所以可以生成一个vcf文件在PC端。

具体项目文件请见：https://github.com/marhovey/QRcode;

jq-qrcode直接访问：https://github.com/jeromeetienne/jquery-qrcode;

1、生成微信名片二维码：

function createvcf() {
　　$(".qrBox").css({display:"block"});
　　var a,
　　c = $("#name").html().replaceAll(" ", ""),
　　d = $("#title").html().replaceAll(" ", ""),
　　e = $("#adr").html().replaceAll(" ", ""),
　　f = $("#org").html().replaceAll(" ", ""),
　　g = $("#cell").html().replaceAll(" ", ""),
　　h = $("#home").html().replaceAll(" ", ""),
　　i = $("#url").html().replaceAll(" ", ""),
　　j = $("#email").html().replaceAll(" ", "");
　　e=e.slice(0,e.search("<img"));
　　a = "BEGIN:VCARD", a += "\r\nN:"+ c, d && (a += "\r\nTITLE:" + d), e && (a += "\r\nADR;WORK:;;" + e + ";;;;"), f && (a += "\r\nORG:" + f), g && (a += "\r\nTEL;CELL,VOICE:" + g), h && (a += "\r\nTEL;WORK,VOICE:" + h), i && (a += "\r\nURL;WORK:" + i), j && (a += "\r\nEMAIL;INTERNET,HOME:" + j), a += "\r\nEND:VCARD", $("#qrcode").empty().qrcode({
　　　　render: "image",
　　　　ecLevel: "0" == $("#mode").val() ? "L": "H",
　　　　size: 300,
　　　　background: "#fff",
　　　　fill: $("#fill").val(),
　　　　radius: $("#radius").val(),
　　　　mode: 1 * $("#mode").val(),
　　　　fontcolor: $("#fontcolor").val(),
　　　　label: c,
　　　　text: a
　　})
　　}
　　String.prototype.replaceAll = function(a, b) {
　　return this.replace(new RegExp(a.replace(/([\(\)\[\]\{\}\^\$\+\-\*\?\.\"\‘\|\/\\])/g, "\\$1"), "ig"), b)
　　};
　　document.getElementById(‘btn‘).onclick=function(){
　　createvcf();
}

2、生成域名二维码：

(function () {
　　‘use strict‘;

　　var jq = window.jQuery;
　　var guiValuePairs = [
　　　　[‘size‘, ‘px‘],
　　　　[‘minversion‘, ‘‘],
　　　　[‘quiet‘, ‘ modules‘],
　　　　[‘radius‘, ‘%‘],
　　　　[‘msize‘, ‘%‘],
　　　　[‘mposx‘, ‘%‘],
　　　　[‘mposy‘, ‘%‘]
　　];

　　function updateGui() {
　　　　jq.each(guiValuePairs, function (idx, pair) {
　　　　　　var $label = jq(‘label[for="‘ + pair[0] + ‘"]‘);
　　　　　　$label.text($label.text().replace(/:.*/, ‘: ‘ + jq(‘#‘ + pair[0]).val() + pair[1]));
　　　　});
　　}
　　function updateQrCode() {
　　　　var options = {
　　　　　　render: "image",
　　　　　　ecLevel: "H",
　　　　　　minVersion: parseInt("1", 10),

　　　　　　fill: "#333",
　　　　　　background: "#fff",

　　　　　　text: document.URL,

　　　　　　//大小
　　　　　　size: parseInt("150", 10),

　　　　　　radius: parseInt("0", 10) * 0.01,
　　　　　　quiet: parseInt("1", 10),

　　　　　　mode: parseInt("0", 10),

　　　　　　image: jq(‘#img-buffer‘)[0]
　　　　};

　　　jq(‘#erwm‘).empty().qrcode(options);
　　}

　　function update() {
　　　　updateGui();
　　　　updateQrCode();
　　}

　　function onImageInput() {
　　　　var input = jq(‘#image‘)[0];
　　　　if (input.files && input.files[0]) {
　　　　　　var reader = new FileReader();
　　　　　　reader.onload = function (event) {
　　　　　　　　jq(‘#img-buffer‘).attr(‘src‘, event.target.result);
　　　　　　　　jq(‘#mode‘).val(‘4‘);
　　　　　　　　setTimeout(update, 250);
　　　　};
　　　　reader.readAsDataURL(input.files[0]);
　　　　}
　　}
　　function init() {
　　　　jq(‘#image‘).on(‘change‘, onImageInput);
　　　　jq(window).load(update);
　　　　update();
　　　}
　　jq(init);
}());

3、生成vcf文件：

<?php
　　header("Content-type: text/html; charset=utf-8");
　　$name=$_POST["name"];
　　$title=$_POST["title"];
　　$adr=$_POST["adr"];
　　$org=$_POST["org"];
　　$cell=$_POST["cell"];
　　$home=$_POST["home"];
　　$url=$_POST["url"];
　　$email=$_POST["email"];
　　$myfile=fopen("index.vcf","w");
　　$txt="BEGIN:VCARD\r\n"."N:".$name."\r\nORG:".$org."\r\nTITLE:".$title."\r\nADR;TYPE=WORK:;;".$adr."\r\nTEL;TYPE=CELL,VOICE:".$cell."\r\nTEL;TYPE=WORK,VOICE:".$home."\r\nEMAIL;TYPE=PREF,INTERNET:".$email."\r\nEND:VCARD";
　　fwrite($myfile, $txt);
　　fclose(myfile);
?>