文档章节

通过二维码开放平台的API快速生成二维码

Jceee
 Jceee
发布于 2014/09/06 17:06
字数 502
阅读 9.9K
收藏 28

「深度学习福利」大神带你进阶工程师,立即查看>>>

       现在很多网站都有通过扫二维码用手机连接的功能,联图网(http://www.liantu.com/pingtai/)的二维码开放平台开放了一个生成二维码图片的Api,挺方便使用的。闲着无聊,写了个前台快速生成二维码的方法。

       html代码如下:(二维码将生成在这div下)

  <div id='qrcode'></div>

         js代码如下:

var qrCode = {
    //初始化属性
    jsonData:{
        content     : '',  //内容,可为utl,如html://www.baidu.com 或文字,图片信息之类的
        logo        : '',  //二维码中间显示图片,   如:html://wwww.xxx.com/imgname.jpg
        bgColor     : '',  //背景颜色,             格式 :颜色代码            如fffaf0
        fgColor     : '',  //前景颜色,即条纹颜色     格式 :同上
        gcColor     : '',  //渐变颜色,              格式 : 同上
        ptColor     : '',  //定位点颜色(外框)        格式:同上
        inptColor   : '',  //定位点颜色(内点)        格式:同上
        eLevel      : '',  //纠错等级, 可用值:h\q\m\l  格式 : 单个字符         如 h
        w           : '',  //宽度尺寸               格式:像素值              如  200
        m           : ''   //外边距尺寸               格式:如上
    },
    //获取二维码图片
    getQrcode:function(divId){
        //javascript写法
        var divElement = document.getElementById(divId),
            imgHtml    = this.setImgHeml(this.jsonData);
        divElement.innerHTML = imgHtml;
        /* //jQuery写法
        var imgHtml    = this.setImgHeml(this.jsonData);
        $("#"+divId).append(imgHtml);*/
    },
    //构造图片
    setImgHeml:function(jsonData){
        var imgHtml = "<img src='http://qr.liantu.com/api.php?";
        imgHtml += jsonData.content?"&text="+jsonData.content:"";
        imgHtml += jsonData.logo?"&logo="+jsonData.logo:"";
        imgHtml += jsonData.bgColor?"&bg="+jsonData.bgColor:"";
        imgHtml += jsonData.fgColor?"&fg="+jsonData.fgColor:"";
        imgHtml += jsonData.gcColor?"&gc="+jsonData.gcColor:"";
        imgHtml += jsonData.ptColor?"&pg="+jsonData.ptColor:"";
        imgHtml += jsonData.inptColor?"&inpt="+jsonData.inptColor:"";
        imgHtml += jsonData.eLevel?"&el="+jsonData.eLevel:"";
        imgHtml += jsonData.w?"&w="+jsonData.w:"";
        imgHtml += jsonData.m?"&m="+jsonData.m:"";
        imgHtml += "'>";
        return imgHtml;
    }
};

   调用很简单,只需要通过设置qrCode的jsonData中你需要的属性就可以了,不需要可以不设置

//设置内容为当前url路径
qrCode.jsonData.content =  window.location.href;
//设置宽度尺寸
qrCode.jsonData.w =  500;
//设置外边框距
qrCode.jsonData.m =  50;
//在id为qrcode的元素下生成二维码图片
qrCode.getQrcode('qrcode');

  通过这几行设置代码,就可以轻松地生成二维码了。

Jceee
粉丝 16
博文 47
码字总数 19440
作品 0
广州
程序员
私信 提问
加载中
请先登录后再评论。
Netty那点事(三)Channel与Pipeline

Channel是理解和使用Netty的核心。Channel的涉及内容较多,这里我使用由浅入深的介绍方法。在这篇文章中,我们主要介绍Channel部分中Pipeline实现机制。为了避免枯燥,借用一下《盗梦空间》的...

黄亿华
2013/11/24
2W
22
beego API开发以及自动化文档

beego API开发以及自动化文档 beego1.3版本已经在上个星期发布了,但是还是有很多人不了解如何来进行开发,也是在一步一步的测试中开发,期间QQ群里面很多人都问我如何开发,我的业余时间实在...

astaxie
2014/06/25
2.7W
22
树莓派(Raspberry Pi):完美的家用服务器

自从树莓派发布后,所有在互联网上的网站为此激动人心的设备提供了很多有趣和具有挑战性的使用方法。虽然这些想法都很棒,但树莓派( RPi )最明显却又是最不吸引人的用处是:创建你的完美家用...

异次元
2013/11/09
8K
8
5分钟 maven3 快速入门指南

前提条件 你首先需要了解如何在电脑上安装软件。如果你不知道如何做到这一点,请询问你办公室,学校里的人,或花钱找人来解释这个给你。 不建议给Maven的服务邮箱来发邮件寻求支持。 安装Mav...

fanl1982
2014/01/23
1.2W
8
代码生成器--Codgen

Codgen是一个基于数据库元数据模型,使用freemarker模板引擎来构建输出的代码生成器。freemarker的数据模型结构通常来说都是一个Map树状结构模型,codgen也不例外,它的数据模型这棵树的根节...

黄天政
2013/01/29
1.4W
2

没有更多内容

加载失败,请刷新页面

加载更多

Hystrix核心原理和断路器源码解析

Hystrix运行原理 构造一个HystrixCommand或HystrixObservableCommand对象 执行命令。 检查是否已命中缓存,如果命中直接返回。 检查断路器开关是否打开,如果打开,直接熔断,走fallback逻辑...

xiaolyuh
59分钟前
10
0
求职应聘,如何自我分析人格优势?

“你那里有没有合适的工作介绍给我啊?” “我想找份我喜欢的工作,可是好难啊怎么办啊?” “为什么我求职总是不成功呢?” 最近我总是接到朋友询问工作相关的消息,给她们提供招聘信息的同...

蛤蟆丸子
今天
17
0
Pycharm、Idea、Goland 官方汉化来了

作为软件开发的编辑器,不得不提大名鼎鼎的 JetBrains 公司,其出品的软件:Pycharm、Idea、WebStorm、phpstorm、CLion、RubyMine、AppCode、DataGrid,目前来讲都是最受欢迎的! 可是由于软...

猪哥66
今天
18
0
数据分析师必学第一课:构建完整的指标体系

本文分享自微信公众号 - 大数据架构师专家(xinsz08)。 如有侵权,请联系 support@oschina.cn 删除。 本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一起分享。...

致码高胜寒
今天
10
0
B站牛逼的实时弹幕系统架构是如何实现的

点击上方 “Java架构师社区”关注我们,设为星标 回复"架构师"获取资源 前言:随着直播的发展,直播弹幕也逐渐火爆起来。在架构设计上,高稳定、高可用、低延迟是一款直播弹幕系统必备的三要素...

Java架构师历程
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部