当前位置:首页 > 网页设计 >Javascript >

jquery二维码生成插件

发布时间:2020-07-10 16:27:05 作者:佚名 阅读:(255)

最近做的一个网站详情页面需要展示对应的移动页面的二维码,使用程序生成太浪费服务器的资源,只好借助jquery.qrcode生成二维码,接下来吾爱编程为大介绍一下使用方法,有需要的小伙伴可以参考一下:

1、介绍:

    jquery.qrcode.js是用于纯浏览器qrcode生成的jquery插件。它使您可以轻松地将qrcode添加到您的网页。它是独立的,minify + gzip后不到4k,没有图像下载。它不依赖于打开或关闭的外部服务,也不会增加加载时的延迟。它基于一个以各种语言构建qrcode 的库。jquery.qrcode.js对其进行了包装,使其易于包含在您自己的代码中。

2、使用方法:

    (1)、引入jquery和jquery.qrcode.min.js

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.qrcode.min.js"></script>

    (2)、创建一个DOM元素,其中将包含生成的qrcode图像。可以说一个div

<div id="qrcode"></div>

    (3)、通过以下方式将qrcode添加到此容器中

jquery('#qrcode').qrcode("https://m.itbiancheng.com");

3、使用扩展:

    (1)、指定二维码的生成方式:

//使用table生成
jQuery('#qrcode').qrcode({
    render: "table",
    text: "https://m.itbiancheng.com"
});
 
//使用canvas生成
jQuery('#qrcode').qrcode({
    render: "canvas",
    text: "https://m.itbiancheng.com"
});

    (2)、指定生成二维码的大小:

jQuery('#qrcode').qrcode({
    render: "canvas", //也可以替换为table
    width: 100,
    height: 100,
    text: "https://m.itbiancheng.com"
});

    (3)、指定生成二维码的色彩样式:

//生成前景色为红色背景色为白色的二维码
jQuery('#qrcode').qrcode({
    render: "canvas", //也可以替换为table
    foreground: "#C00",
    background: "#FFF",
    text: "https://m.itbiancheng.com"
});

4、插件下载:

    (1)、本站下载地址:

https://down.itbiancheng.com/uploads/soft/jquery-qrcode-master.zip

    (2)、github下载地址:

https://github.com/jeromeetienne/jquery-qrcode

 以上就是吾爱编程为大家介绍的关于使用jquery.qrcode生成二维码的方法,了解更多相关文章请关注吾爱编程网!

欢迎分享转载→ jquery二维码生成插件

© 2015-2019 - 吾爱编程网 版权所有 苏ICP备18033726号-1关于我们 - 网站声明 - 联系我们