Question

我是ASP.NET MVC的新手，我正在尝试将一些Javascript集成到我正在制作的网站中作为此技术的测试。

我的问题是：如何将Javascript代码插入视图？

假设我从默认的ASP.NET MVC模板开始。在视图方面，这将创建主页面，“主页”视图和“关于”视图。名为Index.aspx的“Home”视图如下所示：

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="indexTitle" ContentPlaceHolderID="TitleContent" runat="server">
    Home Page
</asp:Content>

<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent" runat="server">
    <h2><%= Html.Encode(ViewData["Message"]) %></h2>
    <p>
        To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
    </p>
    <p>Welcome to this testing site!</p>
</asp:Content>

在此处添加<script>标记不起作用。我应该在哪里以及如何做？

P.S。：我有一种感觉，我错过了一些非常基本的东西......提前谢谢！

Answer 1

您可能需要考虑的一件事是在主页面上添加“脚本”内容占位符，在主体末尾加载脚本。这样您就可以在页面末尾加载脚本，这样就不会减慢加载DOM元素的速度（一旦脚本开始加载，它一次只能执行一个请求，因为代码可能会影响DOM）。这对PartialView来说有点棘手 - 如果你在其中包含代码，你需要找到一种方法来延迟执行那些在加载这些脚本后依赖于后续脚本的东西。折衷方案可能是在标题中加载jQuery之类的东西，在主体末尾加载其他常用脚本。

的Site.Master

   <body>

   ...
   <asp:ContentPlaceHolder runat="server" id="MainContent"></asp:ContentPlaceHolder>

   ...

   <script type="text/javascript" src="<%= Url.Content( "~/scripts/jquery-1.4.1.min.js" ) %>"></script>
   <asp:ContentPlaceHolder runat="server" id="ScriptContent"></asp:ContentPlaceHolder>
   </body>
   </html>

查看

  <asp:Content runat="server" ID="mainContent" ContentPlaceHolderID="MainContent">

     ... HTML ...
  </asp:Content>

  <asp:Content runat="server" ID="scriptContent" ContentPlaceHolderID="ScriptContent">

  <script type="text/javascript">
     $(function() {
       $('.selector').click( function() {
            ...
       });
     });
  </script>

  </asp:Content>

Answer 2

只是偶然发现了这个问题，并希望在Visual Studio 2013中添加一条评论，它可以更优雅的方式完成。

在您的母版页中，只需将以下代码放在页面底部（在默认生成的母版页中，此代码已存在）：

<body>
    ...
    @RenderSection("scripts", required: false)
</body>
</html>

然后在您的视图中，底部是以下代码：

@section scripts
{
    <script src="...script url..."></script>
}

或者如果您使用捆绑

@section scripts {
    @Scripts.Render("~/bundles/<script id>")
}

或者你可以放一个＆lt; script＆gt; ...＆lt; / script＆gt;将您的Javascript代码放入视图中的@section脚本块。

Answer 3

在您的母版页的<asp:ContentPlaceHolder>内创建一个额外的<head>，然后您的视图将有第三个<asp:Content>部分供您注册外部.js文件，自定义<script>阻止，外部.css文件和自定义<style>阻止。

Answer 4

<script>代码需要进入<asp:Content>区块。（否则，它会在哪里结束？）

如何将Javascript放入ASP.NET MVC视图

4 个答案: