未捕获的ReferenceError：虽然加载了jquery，但未定义$

I have some javascript on an .aspx page however it appears that jquery is not defined even though the google chrome page inspector is loading jquery. The scripts are loaded through a bundle config.

我在.aspx页面上有一些javascript但是看起来即使google chrome页面检查器正在加载jquery,也没有定义jquery。脚本通过bundle配置加载。

Bundle Config

bundles.Add(new ScriptBundle("~/bundles/allscripts").Include(
            "~/Scripts/jquery-{version}.js",
            "~/Scripts/jquery-migrate-{version}.js",
            "~/Scripts/jquery-ui-{version}.js",
            "~/Scripts/Common.js",
            "~/Scripts/knockout-{version}.js",
            "~/Scripts/knockout.mapping-latest.js",
            "~/Scripts/knockout-ext.js",
            "~/Scripts/jquery.maskedinput.js",
            "~/Includes/Lightbox/lightbox.js",
            "~/Scripts/scrollTo.js",
            "~/Scripts/modernizr-{version}.js",
            "~/Scripts/Watermark.js",
            "~/Scripts/jquery.validate.js",
            "~/Scripts/json2.js",
            "~/Scripts/jquery.autosave.js",
            "~/Scripts/bootstrap.js",
            "~/Scripts/jquery.fileupload.js",
            "~/Scripts/toastr.js"
            ));

JavaScript

<script type="text/javascript">
    $(function () {
        var displayMessage = false;
        var queryForEligibleUser = $.getJSON('../Mvc/Home/DetermineIfWeShouldShowMessage', function (data) {
            var result = $.parseJSON(data);
            displayMessage = result;
        }).done(function () {
            console.log("Display  message: ", displayMessage);
            if (displayMessage) {
                $.getJSON('../Mvc/Home/GetMessageToDisplay', function (messageToDisplay) {
                    console.log(messageToDisplay);
                    $('#DisplayMessage').text(messageToDisplay);
                });
            }
        });
    });
</script>

Below this script near the bottom of the page is where the scripts are loaded.

在页面底部附近的脚本下面是加载脚本的位置。

<![if (gt IE 8) | (!IE)]>
<script src="/Scripts/jquery-2.1.3.js"></script>
<script src="/Scripts/jquery-migrate-1.2.1.js"></script>
<script src="/Scripts/jquery-ui-1.11.4.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/modernizr-2.8.3.js"></script>
<script src="/Scripts/Common.js"></script>
<script src="/Scripts/knockout-3.3.0.debug.js"></script>
<script src="/Scripts/knockout.mapping-latest.debug.js"></script>
<script src="/Scripts/knockout-ext.js"></script>
<script src="/Scripts/jquery.maskedinput.js"></script>
<script src="/Includes/Lightbox/lightbox.js"></script>
<script src="/Scripts/scrollTo.js"></script>
<script src="/Scripts/Watermark.js"></script>
<script src="/Scripts/json2.js"></script>
<script src="/Scripts/jquery.autosave.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/jquery.fileupload.js"></script>
<script src="/Scripts/toastr.js"></script>

1 个解决方案

#1

I found a solution here.enter link description here

我在这里找到了解决方案。在这里输入链接描述

I moved the script into a separate file and then put the reference at the bottom of the page.

我将脚本移动到一个单独的文件中,然后将引用放在页面底部。

<script type="text/javascript" defer="defer" src="../Areas/Mvc/Scripts/ShowMessage.js"></script>

I used defer so the script is downloaded after the HTML is rendered.

我使用defer,因此在呈现HTML后下载脚本。

#1