我正在 VS 2012、.NET Framework 4.5 中使用 C# 构建 ASP.NET Webform 应用程序
我在应用程序的根目录中有一个 MasterPage，JavaScript 文件位于名为 js 的文件夹中。
问题是:如果页面在根文件夹中 那么一切都工作正常 (css+js)，如果我将任何页面放在子文件夹中 然后 css 可以工作，但是那些 JavaScripts 根本不工作，显然引用路径是错误的。
所以 Css 引用路径很好，但是对于脚本，无论我使用什么，它们都不起作用(js/script.js 或 ~/js/script.js 或/js/script.js 或 ../ResolveUrl、ResolClientveUrl ... 或此 http://yobriefca.se/blog/2010/10/19/%3C-head-%3Eache-including-javascript-in-asp-dot-net-master-pages/ 中的所有方法)它们都引用 root/SUB-FOLDER/js/script.js 而不是 root/js/script.js
在根目录中:单个 MasterPage、Default.aspx、test.aspx、js 文件夹、css 文件夹和 Pages 文件夹。默认页面和测试页面是工作文件，但是 Pages 文件夹中的所有页面都不会显示 .js 所以当页面不在根目录中时路径是错误的
在我的母版页中:
<head runat="server">
<title></title>
<link rel="stylesheet" href="~/css/style.css" />
<%-- tried these and lot more but NOT workkkkkkkkkkk --%>
<%--<script src="~/js/jquery-1.7.1.min.js" ></script>
<script src="~/js/script.js" ></script>--%>
<%--<script src='<%=ResolveUrl("~/js/jquery-1.7.1.min.js") %>' ></script>
<script src='<%=ResolveUrl("~/js/script.js") %>' type="text/javascript"></script>--%>
<%--<script src='<%=ResolveClientUrl("~/js/jquery-1.7.1.min.js") %>' type="text/javascript"></script>
<script src='<%=ResolveClientUrl("~/js/script.js") %>' type="text/javascript"></script>--%>
<asp:ContentPlaceHolder ID="Head" runat="server">
</asp:ContentPlaceHolder>
script.js 是这样的:
....
$.include('js/superfish.js')
$.include('js/FF-cash.js')
$.include('js/tms-0.4.x.js')
$.include('js/uCarausel.js')
$.include('js/jquery.easing.1.3.js')
$.include('js/jquery.tools.min.js')
$.include('js/jquery.jqtransform.js')
$.include('js/jquery.quicksand.js')
$.include('js/jquery.snippet.min.js')
$.include('js/jquery-ui-1.8.17.custom.min.js')
$.include('js/jquery.cycle.all.min.js')
$.include('js/jquery.cookie.js')
$(function(){
if($('.tweet').length)$.include('js/jquery.tweet.js');
if($('.lightbox-image').length)$.include('js/jquery.prettyPhoto.js');
if($('#contact-form').length||$('#contact-form2').length)$.include('js/forms.js');
if($('.kwicks').length)$.include('js/kwicks-1.5.1.pack.js');
if($('#counter').length)$.include('js/jquery.countdown.js');
if($('.fixedtip').length||$('.clicktip').length||$('.normaltip').length)$.include('js/jquery.atooltip.pack.js')
// Slider
$('.main-slider')._TMS({
.....
Web 浏览器的开发人员工具(控制台)出现错误:
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/tms-0.4.x.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/uCarausel.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/jquery.jqtransform.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/jquery.quicksand.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/jquery.snippet.min.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/FF-cash.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/superfish.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/jquery.tools.min.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/jquery-ui-1.8.17.custom.min.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/jquery.cycle.all.min.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/jquery.easing.1.3.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://ApplicationRoot/Pages/js/jquery.cookie.js
Uncaught TypeError: Object [object Object] has no method '_TMS' script.js:22
event.returnValue is deprecated. Please use the standard event.preventDefault() instead.
最佳答案
HTML
您通常不需要 <head /> 中的任何脚本除了像 Modernizr 这样的脚本具有特征检测。将所有脚本移动到页面底部更像是一个最佳实践:
<html>
<head runat="server">
<title></title>
<link rel="stylesheet" href='<%= ResolveUrl("~/css/style.css") %>' />
<asp:ContentPlaceHolder ID="Head" runat="server" />
</head>
<body>
<!-- Scripts at bottom of page for faster loading. -->
<script src='<%= ResolveUrl("~/js/jquery-1.7.1.min.js") %>'></script>
<script src='<%= ResolveUrl("~/js/script.js") %>'></script>
</body>
</html>
脚本.JS
引用 script.js 中的其他脚本文件将需要 /像这样附加到 'js/`:
$.include('/js/superfish.js');
$.include('/js/FF-cash.js');
$.include('/js/tms-0.4.x.js');
$.include('/js/uCarausel.js');
$.include('/js/jquery.easing.1.3.js');
$.include('/js/jquery.tools.min.js');
$.include('/js/jquery.jqtransform.js');
$.include('/js/jquery.quicksand.js');
$.include('/js/jquery.snippet.min.js');
$.include('/js/jquery-ui-1.8.17.custom.min.js');
$.include('/js/jquery.cycle.all.min.js');
$.include('/js/jquery.cookie.js');
if($('.tweet').length)
$.include('/js/jquery.tweet.js');
if($('.lightbox-image').length)
$.include('/js/jquery.prettyPhoto.js');
if($('#contact-form').length || $('#contact-form2').length)
$.include('/js/forms.js');
if($('.kwicks').length)
$.include('/js/kwicks-1.5.1.pack.js');
if($('#counter').length)
$.include('/js/jquery.countdown.js');
if($('.fixedtip').length || $('.clicktip').length || $('.normaltip').length)
$.include('/js/jquery.atooltip.pack.js');
// Slider
$('.main-slider')._TMS({
杂项
在测试所有这些时不要忘记清除缓存或在隐私浏览中工作!
关于c# - 如何在 MasterPage 中包含 JavaScript？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20641559/