<!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. kvm环境部署及常用指令

    Linux下通过kvm创建虚拟机,通过vnc连接,做好配置后,通过ssh登录,并开启iptables Kvm虚拟化搭建教程参考链接:https://jingyan.baidu.com/article/ ...

  2. AutoMapper的源码分析

    最近有一个小项目需要提供接口给第三方使用,接口会得到一个大的XML的字符串大约有8个对象100多个字段,在映射到Entity只能通过反射来赋值避免重复的赋值,但是明显感觉到性能下降严重,因为以前接触过 ...

  3. 聊两句XSS（跨站脚本攻击）

    XSS(跨站脚本攻击),聊两句,五毛的. XSS的危害: 窃取Cookie,盗用用户身份信息 这玩意儿是大多数XSS的目标,也好解决,可以先治个标,直接设置HttpOnly=true ,即不允许客户端 ...

  4. Offer快到碗里来，Volatile问题终结者

    微信公众号:大黄奔跑关注我,可了解更多有趣的面试相关问题. 写在之前面试问题概览面试回顾大黄可见性Demo演示小插曲大黄可见性Demo演示小插曲大黄可见性Demo演示小插曲总结番外 写在之前 Hell ...

  5. 感知机：Perceptron Learning Algorithm

    感知机是支持向量机SVM和神经网络的基础 f = sign(wx+b) 这样看起来好像是LR是差不多的,LR是用的sigmoid函数,PLA是用的sign符号函数,两者都是线性分类器,主要的差别在于策 ...

  6. 分布式ID生成策略之ZK

    import org.apache.curator.framework.CuratorFramework; import org.apache.curator.framework.CuratorFra ...

  7. Liunx运维(九)-Liunx进程管理命令

    文档目录: 一.ps:查看进程 二.pstree:查看进程状态树 三.pgrep:查找匹配条件的进程 四.kill:终止进程 五.killall:通过进程名终止进程 六.pkill:通过进程名种植进程 ...

  8. istio kiali 亲和性调度

    一.节点调度 在开始 kiali 亲和性调度之前,先演示一个简单的例子介绍 pod 选择调度到指定 node: 节点打标 使用命令查看当前所有 k8s 节点: [root@k8s-master ~]# ...

  9. Sqoop（一）安装及基本使用

    Sqoop:     1.sqoop从数据库中导入数据到HDFS     2.SQOOP从数据库导入数据到hive     3.sqoop从hive中将数据导出到数据库   sqoop底层还是执行的m ...

  10. MySQL中in('5,6,7')只取第一个id为5对应的数据的思考

    通过阅读本文你可以更好的理解两个知识点: 1.#{}与${}在实际项目中的使用,避免在项目中使用不当造成不可预知的Bug; 2.MySQL中in里面如果是字符串的话,为什么只取第一个对应的数据,eg: ...