如何在 ASP.NET 项目中包含 jquery 插件答案

【问题标题】：how to include jquery plugins in an ASP.NET project如何在 ASP.NET 项目中包含 jquery 插件
【发布时间】：2014-06-03 04:16:14
【问题描述】：

我正在尝试将这个 jquery 插件包含在我的 asp.net 项目中：http://www.berriart.com/sidr/#

但是我总是得到一个 Uncaught TypeError: undefined is not a function 错误。我希望这个插件出现在每个页面上，所以我认为我需要将它包含在我的 _Layout 文件中。我不知道我做错了什么。

所以我有：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")

<script src="~/Scripts/sidr-package-1.2.1/jquery.sidr.min.js"></script>
<link href="~/Scripts/sidr-package-1.2.1/stylesheets/jquery.sidr.dark.css" rel="stylesheet" />

<script type="text/javascript">
    $(document).ready(function () {
        $('#simple-menu').sidr();
    });
</script>

@*From their sample *@
<a id="simple-menu" href="#sidr">Toggle menu</a>

<div id="sidr">
    <!-- Your content -->
    <ul>
        <li><a href="#">List 1</a></li>
        <li class="active"><a href="#">List 2</a></li>
        <li><a href="#">List 3</a></li>
    </ul>
</div>

<div class="container body-content">

    @RenderBody()

</div>

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)

【问题讨论】：

依赖jQuery，所以页面上的脚本引用需要在jQuery之后

标签： jquery html asp.net asp.net-mvc-5

【解决方案1】：

文档显示需要在 jQuery 之后加载 Sidr 插件，如下所示：

<!-- Include jQuery -->
<script src="javascripts/jquery.js"></script>
<!-- Include the Sidr JS -->
<script src="javascripts/sidr/jquery.sidr.min.js"></script>

您正在页面底部呈现 jQuery 包，同时在页面的 <head> 中引用 jQuery.sidr.js 插件。在<body>底部的bundle渲染后移动<script src="~/Scripts/sidr-package-1.2.1/jquery.sidr.min.js"></script>

【讨论】：

OHHHHH。该死的有道理。我从没想过加载脚本的顺序。哦！感谢您的帮助。

【解决方案2】：

我通过两种方法使用它。首先是删除@Scripts.Render 包并添加我自己的脚本，例如

<script type="text/javascript" src="~/content/js/jquery.js"></script>
<script type="text/javascript" src="~/content/js/jqueryslidemenu.js"></script>

如果你想使用 Like @Scripts.Render("~/bundles/jquery") 在 App_Start> Bundle 配置中查看 jquery 是否存在..

【讨论】：