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

时间:2014-04-18 16:01:33

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

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

但是我总是得到一个Uncaught TypeError:undefined不是函数错误。我希望这个插件在每个页面上,所以我认为我需要将它包含在我的_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)

2 个答案:

答案 0 :(得分:4)

文档显示需要在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插件。在<script src="~/Scripts/sidr-package-1.2.1/jquery.sidr.min.js"></script>

底部渲染捆绑后移动<body>

答案 1 :(得分:1)

我用两种方法来使用它。首先是删除@ 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&gt;捆绑jquery存在与否的配置..