zoukankan      html  css  js  c++  java

  • js生产二维码

    1、js生成二维码代码：

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Qrcode Test</title> <script type="text/javascript" src="js/jquery-1.12.0.min.js"></script> <script type="text/javascript" src="js/jquery.qrcode.logo.min.js"></script> <script type="text/javascript"> //创建二维码 function createQRCode(id, url, width, height, src){ $('#'+id).empty(); jQuery('#'+id).qrcode({ render: 'canvas', text: url, width : width, //二维码的宽度 height : height, //二维码的高度 imgWidth : width/4, //图片宽 imgHeight : height/4, //图片高 src: src //图片中央的二维码 }); } function init() { createQRCode("qrcode", "测试", 220, 220, "img/logo.png"); } </script> </head> <body onLoad="init()"> <h1>Qrcode</h1> <div id="qrcode"></div> <p class="col-lg-6 col-md-6" style="text-align: left;" > <a id="download" download="qrcode.jpg"></a> <a id="saveQrCode" style="cursor: pointer;">下载二维码</a> </p> </body> </html>

    注意事项：

    　　2、点击下载事件：

    $('#saveQrCode').click(function(){ var canvas = $('#qrcode').find("canvas").get(0); try {//解决IE转base64时缓存不足，canvas转blob下载 var blob = canvas.msToBlob(); navigator.msSaveBlob(blob, 'qrcode.jpg'); } catch (e) {//如果为其他浏览器，使用base64转码下载 var url = canvas.toDataURL('image/jpeg'); $("#download").attr('href', url).get(0).click(); } return false; });
  • 相关阅读:
    Document
    Document
    Document
    2.原型和原型链的关系以及查找顺序
    1.面向对象 及 相关知识点
    时间对象 <-> 定时器 <-> 电子时钟 <-> 倒计时效果
    定时器
    let var const 的区别
    ES6 中块的概念
    js中的闭包
  • 原文地址：https://www.cnblogs.com/pyj63/p/8038431.html
Copyright © 2011-2022 走看看