1、引入jquery的两个js文件

<script src="../scripts/erweima/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="../scripts/erweima/jquery.qrcode.min.js"></script>

2、准备一个展示二维码的div

<div id="output" style="margin:0px auto"></div>

3、生成二维码的js

$("#output").empty();
jQuery('#output').qrcode("二维码的内容");//二维码生成

生成后的二维码效果

4.二维码保存

因为二维码生成后使用的是H5的canvas标签展示在jsp页面,所以将二维码保存为图片也方便了很多。canvas提供了方法。

  
function download(){
   var data = $("canvas")[0].toDataURL().replace("image/png", "image/octet-stream;");//获取二维码值,并修改响应头部。
   var filename="tupian.png";//保存的图片名称和格式,canvas默认使用的png格式。这个格式效果最好。
var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
save_link.href = data;
save_link.download = filename; var event = document.createEvent('MouseEvents');
event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
save_link.dispatchEvent(event);
}

  

jquery生成二维码并实现图片下载的更多相关文章

  1. JQuery生成二维码,有资源下载

    原文链接:http://www.yxxrui.cn/article/65.shtml 没时间或者懒得看的,可以直接看加粗部分(或试试手感▼). 使用jquery.qrcode来生成二维码,qrcode ...

  2. 微信生成二维码 只需一个网址即刻 还有jquery生成二维码

    <div class="orderDetails-info"> <img src="http://qr.topscan.com/api.php?text ...

  3. jquery生成二维码图片

    1.插件介绍 jquery.qrcode.min.js插件是jq系列的基于jq,在引入该插件之前要先引入jq.能够在客户端生成矩阵二维码QRCode 的jquery插件 ,使用它可以很方便的在页面上生 ...

  4. 使用jquery生成二维码

    二维码已经渗透到生活中的方方面面,不管到哪,我们都可以用扫一扫解决大多数问题.二狗为了准备应对以后项目中会出现的二维码任务,就上网了解了如何使用jquery.qrcode生成二维码.方法简单粗暴,[] ...

  5. jQuery生成二维码 jquery.qrcode.js

    https://github.com/jeromeetienne/jquery-qrcode 1.将jquery.qrcode.min.js和jquery添加到您的网页中 <script src ...

  6. js,JQuery 生成二维码

    代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...

  7. jquery 生成二维码

    jquery的二维码生成插件qrcode,在页面中调用该插件就能生成对应的二维码 <!DOCTYPE html> <html> <head> <meta ch ...

  8. js生成二维码以及插入图片

    先根据qrcode官网demo,不同属性值的变化,二维码的变化效果:https://larsjung.de/jquery-qrcode/latest/demo/ 进入demo中,审查元素查看里面引用的 ...

  9. js生成二维码以及点击下载二维码

    js生成二维码 jquery.qrcode.js可以快速使用页面生成二维码.但改项目有两个小问题:1.不支持中文:2.不支持二维码中间生成图片. 支持中文的jquery-qrcode jquery.q ...

随机推荐

  1. 20155209林虹宇 Exp7 网络欺诈防范

    Exp7 网络欺诈防范 简单应用SET工具建立冒名网站 kali要作为web服务器让靶机访问冒名网站,所以要使用阿帕奇web服务器软件. 要阿帕奇使用80端口.进入配置文件/etc/apache2/p ...

  2. RocEDU.课程设计2018 第二周进展 博客补交

    本周计划完成的任务 (1).将开发板和平板电脑及其相关配件连通,并和电脑连接. (2).将代码的运行设备从安卓模拟器改为试验箱的平板电脑,平板电脑上实现软件. 本周实际完成情况 (1).计划完成的第一 ...

  3. Dynamics 365 支持使用Web Api 通过名称来检索元数据

    关键检索元数据我在之前的一篇博文中稍有提及,当时是为了取实体的picklist字段的属性,但当时的版本只支持通过metadataid检索,而在365中又增加了名称的检索,方便了很多. 本篇依旧用之前博 ...

  4. [git hooks] pre-commit 配置

    在开发过程中,通常使用 eslint 来规范团队的代码风格.但是 eslint 只能在开发服务器启动的时候才去检验代码.如果一个人在不启动开发服务器的情况下,修改了代码直接提交到git,那么别人pul ...

  5. python 游戏(猜单词Hangman)

    1.游戏思路和流程图 实现功能:随机一个单词让玩家猜测(后续难度实现修改为成语填空,成语必须要有提示,可修改猜的次数,增加连续猜成语,难度系数随着次数的增加而增加) 游戏流程图 2. 单词库和模块 i ...

  6. L2-031 深入虎穴(BFS)

    著名的王牌间谍 007 需要执行一次任务,获取敌方的机密情报.已知情报藏在一个地下迷宫里,迷宫只有一个入口,里面有很多条通路,每条路通向一扇门.每一扇门背后或者是一个房间,或者又有很多条路,同样是每条 ...

  7. symfon2 配置文件使用 + HttpRequest使用 + Global多语言解决方案

    1. 在 app/conig中建立一个自命名的文件: abc.yml 2. 在 app/config/config.yml中导入abc.yml 文件头部: imports:- { resource: ...

  8. PAT甲题题解-1077. Kuchiguse (20)-找相同后缀

    #include <iostream> #include <cstdio> #include <algorithm> #include <string.h&g ...

  9. ffmpeg格式转换

    遇到有些wav文件在ubuntu下无法打开的情况,可以使用ffmpeg进行格式转换即可 ffmpeg -i 0.wav test.wav

  10. springboot+mybatis结合使用

    springboot+mybatis结合使用与普通的ssm配置差别不大,但是少了很多的配置,如spring.xml  web.xml,  给程序员减轻了很多负担 首先创建带有mybatis框架的项目 ...