由于一个坑爹的项目需要生成二维码扫描，后台由于数据库比较麻烦，就只能前端做了，于是乎找到Js生成qrcode的一个库：https://github.com/jeromeetienne/jquery-qrcode，试用了下感觉挺方便的，做个记录。

这是Jquery的一个插件，需要用到Jquery。

  1.  <!DOCTYPE html>
  2.  <html lang="en">
  3.  <head>
  4.      <meta charset="UTF-8">
  5.      <title>QRCODE TEST</title>
  6.  </head>
  7.  <body>
  8.      <div id="code"></div>
  9.  </body>
  10.  <script src="./jquery/jquery.js"></script>
  11.  <script src="./jquery/jquery.qrcode.min.js"></script>
  12.  <script>
  13.      function changeToUtf8(str) {
  14.      var output, i, len, c;
  15.      output = "";
  16.      len = str.length;
  17.      for(i = 0; i < len; i++) {
  18.          c = str.charCodeAt(i);
  19.          if ((c >= 0x0001) && (c <= 0x007F)) {
  20.              output += str.charAt(i);
  21.          } else if (c > 0x07FF) {
  22.              output += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
  23.              output += String.fromCharCode(0x80 | ((c >>  6) & 0x3F));
  24.              output += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
  25.          } else {
  26.              output += String.fromCharCode(0xC0 | ((c >>  6) & 0x1F));
  27.              output += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
  28.          }
  29.      }
  30.      return output;
  31.  }
  32.      var str=changeToUtf8("尼玛");
  33.      $("#code").qrcode({
  34.          render:"table",
  35.          width:200,
  36.          height:200,
  37.          text:str
  38.      });
  39.  </script>
  40.  </html>

之所以需要个changeToUft8函数是因为中文字符直接生成二维码再进行扫描读取的话会乱码，qrcode是采用charCodeAt()进行转码的，默认是unicode编码。

jquery.qrcode笔记的更多相关文章

  1. 使用jquery.qrcode生成二维码（转）

    jQuery 的 qrcode 插件就可以在浏览器端生成二维码图片. 这个插件的使用非常简单: 1.首先在页面中加入jquery库文件和qrcode插件. <script type=" ...

  2. 动态生成二维码插件 jquery.qrcode.js

    前段时间做项目,需要动态生成一个二维码,于是就在网上找了一下发现一个jquery插件jquery.qrcode.js,所以今天就简单说一下这个插件的使用: jquery.qrcode.js是依赖jqu ...

  3. Jquery.Qrcode在客户端动态生成二维码并添加自定义Logo

    0 Jquery.Qrcode简介 Jquery.Qrcode.js是一个在浏览器端基于Jquery动态生成二维码的插件,支持Canvas和Table两种渲染方式,它的优点是在客户端动态生成,减轻了服 ...

  4. jQuery学习笔记(一)jQuery选择器

    目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...

  5. jQuery 学习笔记

    jQuery 学习笔记   一.jQuery概述    宗旨: Write Less, Do More.    基础知识:        1.符号$代替document.getElementById( ...

  6. jquery.qrcode 生成二维码带logo

    <div id="container">这里是二维码显示位置</div> <script language="JavaScript" ...

  7. jQuery学习笔记（一）：入门

      jQuery学习笔记(一):入门 一.JQuery是什么 JQuery是什么?始终是萦绕在我心中的一个问题: 借鉴网上同学们的总结,可以从以下几个方面观察. 不使用JQuery时获取DOM文本的操 ...

  8. 使用jquery.qrcode生成二维码支持logo，和中文

    /* utf.js - UTF-8 <=> UTF-16 convertion * * Copyright (C) 1999 Masanao Izumo <iz@onicos.co. ...

  9. jQuery学习笔记 - 基础知识扫盲入门篇

    jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...

随机推荐

  1. Django框架篇

    Django框架 1.HTTP超文本传输协议 8中请求方法 GET , POST ,HEAD ,PUT ,DELETE , TRACE ,OPTIONS ,CONNCT 状态码 1xx ;服务器收到请 ...

  2. ubuntu16.04设置apt 阿里源

    sudo gedit /etc/apt/sources.listdeb http://mirrors.aliyun.com/ubuntu/ trusty main restricted univers ...

  3. Android 5.0 5.1 webview 闪退问题

    自定义webview /** * 处理Android 5.0 5.1 webview 闪退 */ class MyWebView : WebView { companion object{ priva ...

  4. 2017-2018 ACM-ICPC Northern Eurasia (Northeastern European Regional) Contest (NEERC 17)

    2017-2018 ACM-ICPC Northern Eurasia (Northeastern European Regional) Contest (NEERC 17) A 题意:有 n 个时刻 ...

  5. 可用的 .net core 支持 RSA 私钥加密工具类

    首先说明 MS并不建议私钥加密,而且.net 于安全的考虑,RSACryptoServiceProvider类解密时只有同时拥有公钥和私钥才可以,原因是公钥是公开的,会被多人持有,这样的数据传输是不安 ...

  6. http跳转https反向代理配置

    一.多数项目会有多个域名,把多个域名写在一个conf文件里,比如命名为proxy.conf文件,这里以888.com这个域名为例,在代理机器上配置 server { listen 80; server ...

  7. Datagridview 实现二维表头和行合并

    借鉴别人的,改了改,没用timer using System;using System.Collections.Generic;using System.ComponentModel;using Sy ...

  8. 转：lightGBM的黑科技--plot函数

    本来想研究一下lightGBM的plotting相关的接口,发现网上已经有人做了,而且还挺不错的(lightGBM的黑科技--plot函数),就直接给转过来了 # -*- coding: utf-8 ...

  9. Traffic Network in Numazu

    Traffic Network in Numazu 题目描述 Chika is elected mayor of Numazu. She needs to manage the traffic in ...

  10. iOS性能检测工具instrunments简单介绍

    1.前提条件 在appstore中下载安装xcode 2.打开方式 3.页面元素介绍 3.电脑连接手机选中要测试的app 4.选中要测试哪项,双击进去,点击开始进行监控测试 5.主要介绍一下三项 第一 ...