如何將Javascript添加到ASP.NET MVC視圖

我對ASP.NET MVC非常陌生，我試圖將一些Javascript集成到我正在測試此技術的網站中。如何將Javascript添加到ASP.NET MVC視圖

我的問題是這樣的：如何將Javascript代碼插入到視圖中？

假設我從默認的ASP.NET MVC模板開始。在視圖方面，這會創建一個主頁面，一個「主頁」視圖和一個「關於」視圖。「家」的景觀，被稱爲Index.aspx的，看起來是這樣的：

<%@ 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 .:我有一種感覺，我失去了一些非常基本的東西......在此先感謝！

來源

2010-04-02 Maxim Zaslavsky

去創建一個額外的<asp:ContentPlaceHolder>你的母版的<head>，然後裏面你的意見，將有第三個<asp:Content>部分來登記外部.js文件，自定義<script>塊，外部.css文件和自定義<style>塊。

來源

2010-04-02 01:07:20 Jaxidian

完美的作品，謝謝！聽起來像是一個非常合理的解決方案 – 2010-04-02 01:16:12

不客氣。 :-) – Jaxidian 2010-04-02 01:50:37

<script>標記需要進入<asp:Content>塊。（否則，它會在什麼地方結束？）

來源

2010-04-02 01:07:32 SLaks

您可能要考慮的一件事是在您的母版頁中添加一個「腳本」內容佔位符，該腳本將在主體末尾加載腳本。這樣，您可以在頁面末尾加載腳本，以便它不會減慢加載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>

來源

2010-04-02 01:24:52 tvanfosson

只是偶然在這個問題上，並想添加評論，在Visual Studio中2013它可以更優雅的方式來完成。

在你的母版頁只是把下面的代碼在頁面的底部（默認生成的母版頁的代碼已經存在）：

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

在你看來

然後，只需在底部以下代碼：

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

，或者如果您使用捆綁

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

，或者你可以把一個<腳本> ... < /腳本>將您的Javascript代碼放入視圖中的@section腳本塊中。

來源

2014-01-24 07:33:32

如何將Javascript添加到ASP.NET MVC視圖

回答

相關問題