Hinzufügen von Skript-src in einer Ansicht bei Verwendung von Layout

99

Ich möchte eine Javascript-Referenz wie folgt einfügen:

<script src="@Url.Content("~/Scripts/jqueryFoo.js")" type="text/javascript"></script>

Wenn ich eine Rasiermesseransicht habe, wie kann ich diese richtig einfügen, ohne sie dem Layout hinzufügen zu müssen (ich benötige sie nur in einer bestimmten Ansicht, nicht in allen)?

In aspx könnten wir Inhaltsplatzhalter verwenden. Ich habe ältere Beispiele mit aspx in mvc gefunden, aber nicht in der Razor-Ansicht.

asp.net-mvc razor Dferraro
quelle
1
Fügen Sie einfach das Skript-Tag zu Ihrer Ansicht hinzu.
Jrummell
1
Ich möchte nur das Skript in meiner Ansicht hinzufügen, aber wenn ich die Quelle auf der Seite ansehe, die erstellt wird, werden die Skript-Tags im <body> des HTML-Codes anstelle des <head>?
Dferraro
Für neuere Browser ist type = "text / javascript" nicht erforderlich
Mark Schultheiss

Antworten:

169

Abhängig davon, wie Sie es implementieren möchten (wenn es einen bestimmten Speicherort gab, an dem Sie die Skripte haben wollten), können Sie ein @sectionin Ihrem implementieren, mit _Layoutdem Sie zusätzliche Skripts aus der Ansicht selbst hinzufügen können, während die Struktur erhalten bleibt. z.B

_Layout

<!DOCTYPE html>
<html>
  <head>
    <title>...</title>
    <script src="@Url.Content("~/Scripts/jquery.min.js")"></script>
    @RenderSection("Scripts",false/*required*/)
  </head>
  <body>
    @RenderBody()
  </body>
</html>

Aussicht

@model MyNamespace.ViewModels.WhateverViewModel
@section Scripts
{
  <script src="@Url.Content("~/Scripts/jqueryFoo.js")"></script>
}

Ansonsten ist das, was Sie haben, in Ordnung. Wenn es Ihnen nichts ausmacht, dass es mit der ausgegebenen Ansicht "inline" ist, können Sie die <script>Deklaration in die Ansicht einfügen.

Brad Christie
quelle
3
Übrigens sind Abschnitte im Wesentlichen Ihre Inhaltsplatzhalter, auf die Sie sich bezogen haben. Sehen Sie sich das Standard-MVC-Webprojekt an und wie sie eine Überschrift auf der Seite platzieren.
Brad Christie
Vielen Dank. Das war es, wonach ich gesucht habe - aber ist es möglich, dies ohne den RenderSection zu tun? Sie sagen "Was Sie haben, ist in Ordnung" - aber ich habe noch nichts ... Ich habe versucht, die Skriptreferenzen oben in die .cshtml einzufügen, aber das Ergebnis ist, dass sich die Referenzen im <body> befinden, aber sie sollten im Kopf sein
dferraro
3
@dferraro: Dann müssen Sie RenderSection("Scripts")Ihrem Layout hinzufügen (wie bei einem Platzhalter) und dann ein Layout @section Scripts {}in der Ansicht definieren. Irgendwann steht eine Änderung des "Masters" (_layout) unmittelbar bevor. Sie können nicht einfach etwas in einer Ansicht definieren und sagen, dass es <head>für mich dazwischen liegt (es sei denn, Sie möchten in ein Skript einsteigen, das ein Skript hinzufügt)
Brad Christie
2
+1. Auch @dferraro wäre eine bessere Sache, die Verweise auf jQuery und den RenderSection vor dem </ body> und überhaupt nicht im Kopf zu platzieren. Alte, aber relevante Lektüre: developer.yahoo.com/blogs/ydn/posts/2007/07/high_performanc_5
MikeSmithDev
1
Wenn sich Ihr Skript nicht im ScriptsOrdner befindet, müssen Sie möglicherweise auch den Zugriff darauf aktivieren
Homer
12

Wenn Sie die Razor View Engine verwenden, bearbeiten Sie die Datei _Layout.cshtml. Verschieben Sie das in der Fußzeile vorhandene @ Scripts.Render ("~ / bundles / jquery") in den Header-Bereich und schreiben Sie den Javascript / jquery-Code wie gewünscht:

@Scripts.Render("~/bundles/jquery")
<script type="text/javascript">
    $(document).ready(function () {
        var divLength = $('div').length;
        alert(divLength);
    });
</script>
Dilip Nannaware
quelle
0

Sie können die Skript-Tags hinzufügen, wie wir sie in asp.net verwenden, während Sie clientseitige Überprüfungen wie unten durchführen.

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<script type="text/javascript" src="~/Scripts/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
    $(function () {
       //Your code
    });
</script>
Santhosh Kumar Vadlamani
quelle
für neuere Browser type="text/javascript"wird nicht benötigt
Mark Schultheiss