2014-09-08 14 views
7

Al momento, ho aggiunto il file di origine jQuery alla cartella Scripts del mio progetto ASP.NET. Nella pagina _Layout.cshtml, ho incluso ~/Scripts/jquery-2.1.1.min.js. In questo momento, posso includere il codice jQuery in ogni pagina che faccio in questo modo:Esiste un modo corretto per aggiungere JavaScript personalizzato a una pagina ASP.NET MVC 5?

If this page shows a popup I was succesfull. 

<script> 
$(document).ready(function(){ 
alert("works!"); 
}); 
</script> 

Tuttavia, non si vuole includere uno script completo in ogni punto di vista. Preferirei creare un file JS separato, metterlo nella mia cartella Scripts e quindi includerlo usando Razor.

@{ 
    //Razor Magic inserting Javascript method! 
} 

If this page shows a popup I was succesfull. 

Come posso fare? Ed è il modo "corretto" per includere un file Javascript unico per una singola pagina?

+1

Proprio includono ' nella pagina. –

+0

Se si desidera eseguire facilmente il debug del proprio codice JS, è comunque necessario che sia in un file js separato (il debugger consente solo di breakpoint * sia * codice mvc * o * codice JS nelle viste). Puoi interrompere breakpoint JS nel contenuto dinamico che appare all'inizio della soluzione in fase di esecuzione, ma è noioso. Anche il raggruppamento è il modo migliore per andare (come indicato di seguito) poiché consente di sfruttare al meglio il caching del browser e l'auto-minification del tuo JS. –

risposta

4

Il modo migliore ed elegante per risolvere il problema in MVC è Bundles noto come Bundling and Minification.

Vedere più qui: - http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification

+0

Grazie, sembra interessante. Ora ho bisogno di capire come farlo funzionare in MVC5 però. Apparentemente, ho bisogno di usare nuget per includere questa funzionalità. – ohyeah

+0

@Bas ... welcome..bundling è lo stesso per mvc4 e mvc5 non c'è alcuna differenza e visitare questo link utile anche http://www.dotnet-tricks.com/Tutorial/mvc/c72b040113-Asp.net- MVC-4-prestazioni-ottimizzazione-con-bundling-e-minification.html –

16

si può mettere il codice JS specifica pagina in un file JS separato e può fare riferimento alle specifiche Visualizzazioni utilizzando il seguente pezzo di codice:

1) È necessario mettere questa sezione del _Layout.cshtml

<head> 
    <script type="text/javascript" src="@Url.Content("~/Scripts/jquery-2.1.1.min.js)"> 
    @RenderSection("JavaScript", required: false) 
</head> 

2) È necessario aggiungere @section alla vista in cui si desidera fare riferimento il file JS - (_ABCDView.cshtml)

@section JavaScript 
{ 
    <script type="text/javascript" src="@Url.Content("/Scripts/SampleScript2.js")"></script> 

} 

NOTA: @RenderSection, falsa, significa che la sezione non è richiesto su una vista che utilizza questa pagina master, e il motore di visualizzazione ignorerà il fatto che non c'è la sezione "JavaScript" definito in il tuo punto di vista. Se true, la vista non verrà visualizzata e verrà generato un errore a meno che non sia stata definita la sezione "JavaScript".

E siete a posto!

Spero che questo ti possa aiutare.

Grazie, Swati

Problemi correlati