如何用jquery生成中间有logo的二维码？（附代码）

yulia

发布时间：2018-09-13 16:34:01

2333人浏览过

来源于php中文网

原创

jquery.qrcode.js 是一个能够在客户端生成矩阵二维码qrcode 的jquery插件，使用它可以很方便的在页面上生成二维条码。此插件是能够独立使用的，体积也比较小，使用gzip压缩后才不到4kb。因为它是直接在客户端生成的条码，所以不会有图片下载的过程，能够实现快速生成。它是基于一个多语言的类库封装的，也不依赖于其他额外的服务。

好处：使用jquery-qrcode的好处，不需要在服务器端生成多余的二维码图片，二维码直接通过JavaScript直接在客户端生成，有效减少带宽，以及维护成本。

首先大家可以看一下jquery.qrcode.js官网，官网上也有例子。但是官网的 jquery.qrcode.js是不支持中文的，废话不多说了，现在我们开始吧。官网上的 qrcode.js 文件里没有实现中文的支持和LOGO的添加，现在我们将这个文件修改为jquery.qrcode.js文件了。此外还需要一个对中文进行转码的文件，该文件为utf.js。然后在 jquery.qrcode.js 文件中调用了 utf.js 文件的 utf16to8(str) 方法对其中文进行了转码。

360智图

AI驱动的图片版权查询平台

下载

下面是我写的一个示例，该示例需要的js文件有 jquery.qrcode.js 和 utf.js 以及 jquery-1.8.0.js 。还有一个 LOGO图片可点击下载文件。调用的jsp代码如下：

  <%@ page language="java" contentType="text/html; charset=UTF-8"
      pageEncoding="UTF-8"%>
  
  
  
  
  该二维码支持中文和LOGO
  
  
 
 
 
 
 
 
     
       该二维码支持中文和LOGO

如何在 Qualtrics 中精准追踪用户点击的特定外部链接

响应式全屏滑出菜单：适配移动端与桌面端的平滑动画实现

如何为移动端适配全屏滑出菜单（响应式 slide-out 菜单教程）

实现移动端全屏滑出菜单的响应式适配方案

如何实现响应式全屏滑出菜单（桌面固定宽度，移动端铺满屏幕）

相关标签:

jquery jquery 封装 JS

本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

上一篇：React进阶设计与控制权的内容介绍下一篇：如何对Bootstrap 模态框垂直居中处理

作者最新文章

jQuery中点击按钮实现显示与隐藏的方法

2018-10-29 15:41

如何用html和CSS实现页面加载loading动画效果

2018-10-30 14:41

如何用HTML5在页面中插入可自动播放的视频

2018-10-30 14:53

html5如何插入可自动播放的音频（图文）

2018-10-30 16:08

图文详解JavaScript和jQuery的区别

2018-10-30 17:13

HTML编辑器有哪些？最好用的4款HTML编辑器推荐

2018-10-31 11:48

HTML和CSS实现字体加粗的三种方法

2018-10-31 15:05

CSS如何将段落的首行缩进两个字符（图文详解）

2018-10-31 15:50

图文详解HTML和CSS怎么制作分页效果

2018-10-31 17:28

CSS如何让iframe实现自适应高度的效果

2018-10-31 17:57

热门AI工具

DeepSeek

幻方量化公司旗下的开源大模型平台

AI 编程开发 AI 聊天问答

豆包大模型

字节跳动自主研发的一系列大型语言模型

AI 编程开发 AI大模型

通义千问

阿里巴巴推出的全能AI助手

AI 编程开发 Agent智能体

腾讯元宝

腾讯混元平台推出的AI助手

文档处理 AI 聊天问答

文心一言

文心一言是百度开发的AI聊天机器人，通过对话可以生成各种形式的内容。

AI 编程开发 AI 文本写作

讯飞写作

基于讯飞星火大模型的AI写作工具，可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

AI 文本写作中文写作

即梦AI

一站式AI创作平台，免费AI图片和视频生成。

图片拼接

ChatGPT

最最强大的AI聊天机器人程序，ChatGPT不单是聊天机器人，还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

AI 编程开发 AI 文本写作

智谱清言 - 免费全能的AI助手

AI 编程开发 Agent智能体

相关专题

jquery插件有哪些

jquery插件有jQuery UI、jQuery Validate、jQuery DataTables、jQuery Slick、jQuery LazyLoad、jQuery Countdown、jQuery Lightbox、jQuery FullCalendar、jQuery Chosen和jQuery EasyUI等。本专题为大家提供jquery插件相关的文章、下载、课程内容，供大家免费下载体验。

150

2023.09.12

jquery怎么操作json

操作的方法有：1、“$.parseJSON(jsonString)”2、“$.getJSON(url, data, success)”；3、“$.each(obj, callback)”；4、“$.ajax()”。更多jquery怎么操作json的详细内容，可以访问本专题下面的文章。

311

2023.10.13

jquery删除元素的方法

jquery可以通过.remove() 方法、 .detach() 方法、.empty() 方法、.unwrap() 方法、.replaceWith() 方法、.html('') 方法和.hide() 方法来删除元素。更多关于jquery相关的问题，详情请看本专题下面的文章。php中文网欢迎大家前来学习。

395

2023.11.10