带有 jquery 代码的脚本块应该放在 ASP.NET MVC 母版页的啥位置？
Posted
技术标签:
【中文标题】带有 jquery 代码的脚本块应该放在 ASP.NET MVC 母版页的啥位置？【英文标题】：Where should a script block with jquery code be placed on an ASP.NET MVC Master Page?带有 jquery 代码的脚本块应该放在 ASP.NET MVC 母版页的什么位置？ 【发布时间】：2010-09-23 15:39:33 【问题描述】：开始使用 jquery 并在获取用于 asp.net mvc 的 hello world 类型示例时遇到问题。尝试使用此脚本加载页面时出现运行时错误“预期对象”。
A.脚本标签应该放在母版页的什么位置？ B. 我可能做错了什么？我的页面中肯定有“a”元素？
<script src="../Scripts/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery.corner.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
$("a").click(function(event)
alert("Thanks for visiting!");
);
);
</script>
【问题讨论】：
【参考方案1】：嗯……
回答您的第一个问题：它们应该放在<head> 元素中。
另外，通常我在 DOM 中接收事件时使用'bind' method（就像您正在尝试做的那样）。
所以，代码看起来像：
$(document).ready(function()
// Bind each link to a handler:
$("a").bind('click dblclick', function(event)
alert('click');
)
);
此外，还有一些设计技巧（因为您正在使用我最关心的东西（带有 jQuery 的 ASP.NET MVC）：
在母版页的<head> 元素底部添加一个额外的“ContentPlaceHolder”。这将允许您在适当的位置运行特定于页面的 javascript：在页面的“head”部分，它允许您制作特定于页面的 javascript 包含。
它看起来像这样：
<asp:ContentPlaceHolder ID="HeadContent" runat="server" />
</head>
为什么有用？我会告诉你：你使用的那个 jQuery 圆角插件可能只用在几个页面上——为什么要在每个页面上都包含它？
【讨论】：
【参考方案2】：我同意 Dan 为脚本中的链接添加内容占位符。然而，就性能而言，头部通常不是放置 JavaScript 的最佳位置。最好的地方是在页面的底部。所以你的 html 可以在你的 JavaScript 之前加载。见Yahoo's YSlow tip。不过，您的代码应该仍然可以在 head 部分运行。
我喜欢将我网站的大部分 JavaScript 放在一个文件中，并将其链接到所有页面。如果它变得非常大，您可以将其分成几个文件。这利用了浏览器的缓存。
至于 jQuery 代码有什么问题。我不知道。它看起来很正确。我唯一想知道的是事件参数。试着把它完全去掉。我知道该函数允许使用参数，但我通常使用“this”代替。另外，请尝试重命名参数。
【讨论】：
YSlow 提示的好电话。我没有意识到脚本会阻止并行下载。【参考方案3】：B) 我在快速测试页面上检查了你的内联脚本，它工作正常，所以我建议使用 Firefox 并安装 FireBug 插件来查找问题：
在 Firebug 的“脚本”选项卡中，使用右侧的“监视”窗口插入和检查脚本的某些部分，看看它们会返回什么。 我首先将$ 放在监视窗口中并检查它是否被识别为function()：也许jQuery 没有正确链接
然后将$("a")放入观察窗口并检查它返回的集合是否有正确的数字
对应于集合中“a”选择器的项目数
继续运行部分脚本，直到遇到错误
【讨论】：
【参考方案4】：母版页通常存储在 /Views/Shared/Site.Master 中，而脚本位于 /Scripts 中，因此：
<script src="../Scripts/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery.corner.js" type="text/javascript"></script>
应该是
<script src="../../Scripts/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.corner.js" type="text/javascript"></script>
但我建议使用助手：
public static class Helper
private static string ScriptsRoot = "~/scripts/";
public static string ScriptUrl (string scriptFile)
return VirtualPathUtility.ToAbsolute (ScriptsRoot + scriptFile);
然后像这样引用您的脚本：
<script type="text/javascript" src="<%= Helper.ScriptUrl("jquery-1.2.6.min.js") %>"></script>
<script type="text/javascript" src="<%= Helper.ScriptUrl("jquery.corner.js") %>"></script>
【讨论】：
以上是关于带有 jquery 代码的脚本块应该放在 ASP.NET MVC 母版页的啥位置？的主要内容，如果未能解决你的问题，请参考以下文章
RegisterClientScriptBlock将脚本放在移动浏览器的同一块中
是否可以在 ASP.NET MVC 的脚本块中引用 ViewData？
未捕获的 ReferenceError：未定义 jQuery