`
isy
  • 浏览: 103043 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类

jquery 二维码生成插件

阅读更多

最近公司网站需要商品链接生成二维码以支撑移动端支付,最初考虑ajax调后端java服务(zxing)生成二维码图片保存在服务器,后来不经意搜索到jquery.qrcode.js这个可以在客户端直接生成二维码的jquery插件,用法很简单,首先下载jquery.qrcode.min.js,也可以在本文附件中下载,代码如下:

<!DOCTYPE html>
<html>
<head>
<title>example</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.qrcode.min.js"></script>
</head>
<body>
<div id="qrcode"></div>

<script>
	$('#qrcode').qrcode({
		width: 300,//宽
		height: 300, //高
		render: !!document.createElement('canvas').getContext ? 'canvas' : 'table', //兼容不同浏览器,因为ie浏览器不兼容canvas渲染模式
		text: window.location.href//获取当前链接生成二维码
	});
</script>

</body>
</html>

 

jquery.qrcode.min.js分两种渲染方式生成二维码,一种是在html中插入table以点阵方式填充颜色组成二维码,一种是创建canvas元素再绘制图像(HTML5新特性)。后者是比较清爽的,但ie浏览器兼容性不理想,上面代码第15行有做容错处理。

 

插件还有如下配置:

typeNumber      : -1, //算法模式  
correctLevel    : QRErrorCorrectLevel.H,//纠错  
background      : "#ffffff",//背景色  
foreground      : "#000000" //前景色 

 

如果要生成中文二维码,最好先对中文进行转码 

 

function utf16to8(str) {
    var out, i, len, c;

    out = "";
    len = str.length;
    for(i = 0; i < len; i++) {
	c = str.charCodeAt(i);
	if ((c >= 0x0001) && (c <= 0x007F)) {
	    out += str.charAt(i);
	} else if (c > 0x07FF) {
	    out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
	    out += String.fromCharCode(0x80 | ((c >>  6) & 0x3F));
	    out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
	} else {
	    out += String.fromCharCode(0xC0 | ((c >>  6) & 0x1F));
	    out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
	}
    }
    return out;
}

 

3
0
分享到:
评论

相关推荐

    Jquery 二维码生成插件 美化版

    总的来说,jQuery二维码生成插件美化版通过结合jQuery的强大功能,为开发者提供了一种简单易用的途径来生成和美化二维码,使得二维码在网页设计中更加灵活多样。在实际开发中,根据项目需求,合理利用这些功能,可以...

    JQuery二维码生成插件

    **jQuery二维码生成插件** 在Web开发中,二维码(Quick Response Code)因其高效的信息传递能力而广泛应用,如链接分享、名片交换、支付凭证等。jQuery作为一款轻量级的JavaScript库,简化了DOM操作,使得生成...

    支持中文的,不依赖于类库jquery二维码生成插件

    【标题】: "支持中文的,不依赖于类库jquery二维码生成插件" 这个标题指出的是一个专门设计用于生成二维码的JavaScript插件,其特点在于它不仅能够处理中文字符,而且不依赖于jQuery库。在许多传统的Web开发项目中...

    基于jquery二维码生成插件jquery.qrcode.js在线生成二维码

    标题提到的"基于jquery二维码生成插件jquery.qrcode.js在线生成二维码",就是利用jQuery与名为`jquery.qrcode.js`的插件来实现在网页上动态生成二维码的功能。这个插件允许开发者通过简单的JavaScript调用来创建...

    jQuery生成二维码插件.zip

    jQuery生成二维码插件是Web开发中的一个实用工具,它使得在网页上动态生成二维码变得简单易行。这个插件名为jQuery.qrcode,是基于流行的JavaScript库jQuery构建的,旨在为开发者提供一种轻量级且灵活的方式来创建...

    二维码生成插件

    在jQuery二维码生成插件中,核心功能是将输入的文字、链接或其他数据转换为二维码。这种转换过程通常依赖于开源的二维码编码库,如jsqrcode。该库实现了QR码编码算法,能够处理各种数据类型,包括文本、URL、电子...

    基于jquery二维码生成插件qrcode

    本文详细介绍了如何使用基于jQuery的二维码生成插件qrcode来在网页上生成二维码,这对于希望在自己的网站上嵌入二维码功能的开发者来说是一个很有用的资源。qrcode插件是专为jQuery打造的,允许开发者无需编写复杂的...

    纯jquery二维码生成器

    【jQuery二维码生成器详解】 在IT行业中,二维码已经成为数据传输和信息展示的便捷方式,而“纯jQuery二维码生成器”正是这样一个工具,它利用JavaScript库jQuery实现,使得开发者能够轻松地在网页上创建动态的...

    jQuery网页二维码生成插件.zip

    &lt;title&gt;jQuery二维码生成插件示例 &lt;script src="https://code.jquery.com/jquery.min.js"&gt;&lt;/script&gt; &lt;script src="jiaoben6681.js"&gt;&lt;/script&gt; &lt;div id="qrcode"&gt;&lt;/div&gt; $(document).ready(function(){ $...

    Jquery二维码生成器

    要实现jQuery二维码生成器,我们需要以下关键知识点: 1. **jQuery基础**:首先,确保你的项目已经引入了jQuery库。你可以通过CDN链接或者本地文件引入,例如: ```html &lt;script src="https://code.jquery....

    Jquery 二维码美化(高度定制)

    这个“Jquery 二维码生成插件”提供了生成二维码的功能,并且具备高度定制性。这意味着你可以调整二维码的颜色、大小、边框、填充、错误纠正级别等视觉属性,使其与网站的总体设计保持一致。例如,你可以设置背景色...

    jquery二维码生成和二维码生成器

    总结,jQuery与二维码生成器的结合使得在网页上创建和显示二维码变得简单易行。通过使用`jquery-qrcode`这样的插件,我们可以轻松地根据需要动态生成二维码,并与用户的交互紧密结合,为用户提供便利的信息传递方式...

    jQuery二维码插件

    jQuery二维码插件是一种基于流行的JavaScript库jQuery开发的工具,它允许开发者在网页上方便地生成和显示二维码。二维码,全称Quick Response Code,快速响应码,是一种二维条形码,可以存储大量的数据,如网址、...

    jquery生成二维码

    在jQuery中生成二维码,我们可以借助第三方插件,如`jquery-qrcode`。这个插件允许我们在网页上动态创建二维码,其工作原理是将要编码的数据转换成二维码图案。首先,你需要在项目中引入jQuery库和`jquery-qrcode`...

    在线二维码网页生成器

    5. `jquery.qrcode.js`:可能是另一个版本或变体的jQuery二维码生成插件。 6. `ff-range.js` 和 `scripts.js`:这两个是JavaScript脚本文件,可能包含了额外的自定义功能或交互逻辑。 7. `dummy.png` 和 `back.png`...

    jquery.qrcode.js二维码生成插件并且转换成图片demo

    `jquery.qrcode.js`是一个基于jQuery的插件,它使得在网页上生成二维码变得简单易行。这个插件允许开发者通过JavaScript动态生成二维码,并且还支持将生成的二维码以Canvas形式展示,进而可以将其转换为图片,以便...

Global site tag (gtag.js) - Google Analytics