谷歌浏览器中的Jquery未捕获的引用错误答案

【问题标题】：Jquery Uncaught reference errors in google chrome谷歌浏览器中的Jquery未捕获的引用错误
【发布时间】：2015-09-24 19:33:06
【问题描述】：

我一直在为这个网页设计项目使用 jquery，但我遇到了一个问题。该脚本在 safari 中运行良好，但在 Firefox 和 google chrome 中我得到一个未捕获的参考错误。我在几个地方读到它可能是脚本的字符集，但是当我更改字符集时，什么都不会发生。有没有其他人有这个问题？如果有人知道解决此问题的好方法，我们将不胜感激。

这是我正在使用的脚本：

$(function ($) {
    'use strict';
    var slidebar = new $.slidebars({siteClose: true, scrollLock: true});
    $('i.button').on('click', function () {
        slidebar.slidebars.toggle('left');
    });
});
$(function PYLoad() {
    'use strict';
    $.ajax({
        url: 'http://127.0.0.1:8000/json',
        type: 'GET',
        success: function (data) {
            console.log("PY_Load has Loaded successfully...");
            console.log(data);
            if (data.green === "green") {
                    $('#PY_Load').addClass('server-status-green').removeClass('server-status-red server-status-red-blink default');
            };
            if (data.red === "red") {
                $('#PY_Load').addClass('server-status-red').removeClass('server-status-green server-status-red-blink default');
            };
            if (data.blink === "blink") {
                $('#PY_Load').addClass('server-status-red- blink').removeClass('server-status-green server-status-red default');
            };
            if (data.default === "default") {
                $('#PY_Load').addClass('default').removeClass('server-status-green server-status-red server-status-red-blink');
            };
        },
        complete: function () {
            console.log('Reloading...');
            setTimeout(PYLoad, 3000);
        }
     });
});

我的html页面的头部：

   <head>
        <meta http-equiv="X-UA-Compatible" />
        <meta http-equiv="Content-Type" charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        {% load staticfiles %}
        {% load compress %}
        {% compress css %}
        <link href="{% static 'scss/app.scss' %}" type="text/x-scss" rel="stylesheet" media="all"/>
        {% endcompress %}
        <script src="{% static 'js/jquery/jquery-2.1.4.js' %}" async></script>
        <script src="{% static 'js/modernizr/modernizr.custom.62824.js' %}" async></script>
        <script src="{% static 'js/slidebars/slidebars.js' %}" async></script>
        <script src="{% static 'js/app.js' %}" async></script>
    </head>

以下是控制台中显示的内容：

【问题讨论】：

我好像找不到 JQuery
尝试丢失<script>s 上的async。我不确定async 是如何工作的，但也许它正在运行您的代码之前 jQuery 被加载？
摆脱了async。它就像一个魅力，谢谢。
@RocketHazmat async 表示代码可以异步加载，这样后面的代码就可以执行而无需等待。这就是为什么 Chrome 说 $ 未定义，因为 jQuery 库尚未执行（可能未加载。）

标签： javascript jquery google-chrome firefox referenceerror

【解决方案1】：

删除 Async 标记，以便在函数运行之前加载脚本

【讨论】：