二维码生成【Uncaught ReferenceError: jQuery is not defined】bug解决

关于在使用JQuery和qrcode.js制作二维码时，所有依赖全部导入，但是浏览器控制台报Uncaught ReferenceError: jQuery is not defined错误！ 在这里插入图片描述

引入JS依赖：

JQuery的jquery2.1.4.js
qrcode二维码生成的js依赖jquery.qrcode.js
由于qrcode生成二维码不支持中文，所以引入汉化插件utf.js

<head>
    <meta charset="UTF-8">
    <title>二维码生成</title>
    <!--    二维码生成-->
    <script src="js/jquery.qrcode.js"></script>
    <script src="js/jquery2.1.4.js"></script>
    <!--    汉化插件-->
    <script src="js/utf.js"></script>
</head>

在网页中编写一个div 用于显示二维码

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

准备二维码的规格对象(JSON)

<script>
    var config = {
        width:200,
        height:200,
        text:'我爱你就像风走了千万里不问归期'
    };
</script>

二维码其他的规格属性参考如下：

 var config  = {
            width:数字,//值是number类型, 表示的单位是px  必须传递
            height:数字,//值是number类型, 表示的单位是px  必须传递 
            text:"内容",//text就表示二维码中存储的数据  必须传递
            correctLevel:数字,//取值为0|1|2|3 表示二维码的纠错级别0:L/1:M/2:Q/3:H ,默认0  可选参数
            background:"#rrggbb",//默认白色, 表示二维码的后景颜色 可选参数
            foreground:"#rrggbb",//默认黑色, 表示二维码的前景颜色 可选参数
            render:"绘制模式"//取值:table/canvas , 默认table 可选参数
        };

通过选择器, 查找到上述的div ,得到Jquery对象, 通过jquery对象的qrcode函数生成二维码

$("#qrcode").qrcode(config);

到这步，正常应该是能顺利生成二维码的，但是运行的结果却不对。

问题所在！

由于js执行时是有顺序的，在引入外部js的时候我们是先引入了jquery.qrcode.js，再引入了jquery2.1.4.js。而事实上jquery.qrcode.js的顺利运行要依赖jquery2.1.4.js，所以只要调换JQuery在最先引入即可！在这里插入图片描述