<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />

        <title></title>

        <style type="text/css">

            #qrcode {

                width:160px;

                height:160px;

                margin-top:15px;

            }

        </style>

    </head>

    <body>

        <input id="text" type="text" value="http://www.baidu.com" /><br />

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

        <script src="js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>

        <script src="js/qrcode.min.js" type="text/javascript" charset="utf-8"></script>

        <script type="text/javascript">

            var qrcode = new QRCode("qrcode");

            function makeCode () {

                var elText = document.getElementById("text");

                if (!elText.value) {

                    alert("Input a text");

                    elText.focus();

                    return;

                }

                qrcode.makeCode(elText.value);

            }

            makeCode();

            $("#text").on("blur", function () { //

                makeCode();

            }).on("keydown", function (e) {

                if (e.keyCode == 13) {

                    makeCode();

                }

            });

        </script>

    </body>

</html>

效果预览：

jQuery 自动生成二维码的更多相关文章

  1. jquery自动生成二维码

    把下面的jquery代码放到想要在当前页面上面生成二维码: 代码如下: <script type="text/javascript">var _qrContent='' ...

  2. 使用jquery.qrcode生成二维码及常见问题解决方案

    转载文章  使用jquery.qrcode生成二维码及常见问题解决方案 一.jquery.qrcode.js介 jquery.qrcode.js 是一个纯浏览器 生成 QRcode 的 jQuery ...

  3. 使用jquery.qrcode生成二维码实现微信分享功能

    前言: 最近有个这样的需求,在pc端的商品详情页增加分享功能. 微博分享.QQ好友分享.QQ空间分享这些都很常见.但是微信分享我还没有手动写过(以前改过). 最终效果如下图: 解决方案:使用jquer ...

  4. jQuery.qrcode 生成二维码，并使用 jszip、FileSaver 下载 zip 压缩包至本地。

    生成二维码 引用 jquery.qrcode.js  :连接:https://files.cnblogs.com/files/kitty-blog/jquery.qrcode.js .https:// ...

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

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

  6. （转）js jquery.qrcode生成二维码 带logo 支持中文

    场景:公司最最近在开发二维码支付业务,所以需要做一个html5中的二维码生成和部署! 前天用js生成二维码,节省服务器资源及带宽 原版jquery.qrcode不能生成logo,本文采用的是修改版 1 ...

  7. jquery动态生成二维码添加自定义logo

    动态生成二维码中间带logo. jquery.qrcode.js 动态生成二维码api很简单. 引入jquer(版本任意),引入jquery.qrcode.js 不需要中间带logo这样就可以了.带l ...

  8. 简单的 自动生成 二维码 PHP 方法

    方法一:<style type="text/css">.eweima{    width:200px; height:200px; margin:auto;}</ ...

  9. jQuery前端生成二维码

    引用: <script src="assets/js/jquery.qrcode.min.js" charset="UTF-8"></scri ...

随机推荐

  1. 请收好 Linux 网络命令集锦

    看着kali linux上百个网络命令,我陷入了沉思.专业的网络命令实在是太多了,如果要罗列,上千个也是有的.个人不是渗透测试工作者,大部分功能只知皮毛.所以本文是非常浅显的技术总结,仅聚焦工作中常用 ...

  2. 网易云解锁无版权PC&安卓版

    前言 又是一个不太忙碌的周末 好吧,其实智能车有很多东西要做,其他也有很多东西要处理,但我想咸鱼一个早上. 闲着没事去吾爱破解上翻了翻,找找音乐软件,因为Listen 1有个音源挂了,应该是咪咕的,导 ...

  3. redis scan 命令指南

    redis scan 命令指南 1. 模糊查询键值 redis 中模糊查询key有 keys,scan等,一下是一些具体用法. -- 命令用法:keys [pattern] keys name* -- ...

  4. Linux嵌入式学习-交叉编译openssl

    利用arm-none-linux-gnueabi-gcc交叉编译openssl,生成静态库文件libcrypto.a ,libssl.a 1.从openssl官网下载openssl最新版本,我下载的是 ...

  5. three.js 显示中文字体 和 tween应用

    今天郭先生说一下如何在three中显示中文字体,然后结合tween实现文字位置的动画.线案例请点击博客原文. 1. 生成中文字体 我们都使用过three.js的FontLoader加载typeface ...

  6. 第四章节 BJROBOT 线速度校正 【ROS全开源阿克曼转向智能网联无人驾驶车】

    BJROBOT 线速度校正   1.把小车平放在地板上,用卷尺作为测量刻度,选取车头或者车尾处作为小车的起点, 打开资料里的虚拟机,打开一个终端 ssh 过去主控端启动 roslaunch znjro ...

  7. FTP服务器的搭建和使用（centos7）

    1.显示如下图则表示已安装vsftp软件 如过没有则可以通过yum源进行安装 yum install -y vsftpd 操作:service vsftpd start|stop|restart 2. ...

  8. Java入门随手记-DOS命令

    DOS 打开cmd的方式 开始+系统+命令提示符 win键+r 输入cmd打开控制台(推荐使用) 在任意的文件夹下面,按住shift键+鼠标右键点击,在此次打开命令窗口 资源管理器的地址栏前面加上cm ...

  9. nginx 重写去掉index.php

    if (!-e $request_filename) { rewrite ^/(.*)$ /index.php?s=$1 last; }

  10. 容器编排系统K8s之APIService资源

    前文我们聊到了k8s上crd资源的使用和相关说明,回顾请参考:https://www.cnblogs.com/qiuhom-1874/p/14267400.html:今天我们来了解下k8s的第二种扩展 ...