在ASP.NET中引用jQuery的最佳方式是什么？

Question

我看了Stephen Walther的一场PDC演讲，他在演示中引用了以下代码来调用JQuery js文件：

<asp:ScriptManager id="sm1" runat="server">
<Scripts>
    <asp:ScriptReference Path="~/Scripts/JQuery.js" />
</Scripts>
</asp:ScriptManager>

相比于在页面头部使用链接，采用上述方式有什么优缺点呢？

他还将以下内容放入JavaScript部分来运行JQuery：

<script type="text/javascript">

function pageLoad()
{
   $(":text").css("background-color","yellow");
}
</script>

上面的pageLoad是必要的吗？他提到它来自于Microsoft AJAX库，等待DOM加载完成，但我认为JQuery中的$符号只是一个简写，也可以等待DOM加载完成。

- Xaisoft

Answer 1

$(document).ready()和pageLoad()不是同一个东西！

http://encosia.com/2009/03/25/document-ready-and-pageload-are-not-the-same/

来自文章：

pageLoad()在DOM完成加载后立即调用。不过，这不是pageLoad()被调用的唯一时刻：它也会在每次局部回发之后被调用。

对于应该只运行一次的初始化代码，$(document).ready()是最理想的解决方案。

- Jon Erickson

---

所以，如果我正在使用Microsoft AJAX库，我必须调用pageLoad，但如果我只是使用JQuery，我不需要，对吗？ - Xaisoft

你不必这样做，但你有选择的权利。个人而言，我总是使用jQuery的方式$(function(){});无论是否加载了MS AJAX库。 - Jon Erickson

@Xaisoft - 你应该验证PageLoad函数和文档准备之间没有区别。你可以把你的jQuery代码放在任何一个函数中，但对于MSAJAX的东西，你可能仍然需要使用PageLoad函数。 - RSolberg

pageLoad和document.ready在不同的时间触发。pageLoad在document.ready之后触发。我曾经因此受过伤。我自己使用pageLoad，因为它更可靠。当文档实际上没有完全加载时，我会让document.ready触发。 - Robert C. Barth

pageLoad 可能是在解决 IE 有时在文档实际准备好之前触发 document.ready 的问题。 - Adam Lassek

Answer 2

使用ScriptManager，ASP.NET可以创建单个复合脚本来减少浏览器请求的数量，如果浏览器支持，则还可以压缩脚本。

<asp:ScriptManager ID="ScriptManager1" runat="server">
    <CompositeScript>
        <Scripts>
            <asp:ScriptReference Path="~/Scripts/Script1.js" />
            <asp:ScriptReference Path="~/Scripts/Script2.js" />
            <asp:ScriptReference Path="~/Scripts/Script3.js" />
        </Scripts>
    </CompositeScript>
</asp:ScriptManager>

- Gordon Bell

---

我是新手。你所说的单一复合脚本是什么意思？ - Xaisoft

ASP.NET在将所有.js文件合并成一个压缩脚本后再发送到浏览器。如果您使用多个非最小化脚本，则效果很好。 - Gordon Bell

Answer 3

如果您正在寻找如何引用jQuery文件，这是我的做法：

<script type="text/javascript" src="Scripts/jquery.js"></script>

由于您的页面上会有ScriptManager，因此您还可以利用PageLoad。

function pageLoad() {
    //MSAJAX Stuff...  If Needed
}

$(document).ready(function() {
    $.datepicker.setDefaults($.datepicker.regional[$("#<%= hfCultureAbbreviation.ClientID %>").val()]);
});

- RSolberg

---

这通常是我的做法。你为什么需要PageLoad呢？而且我对JavaScript很陌生，所以在你的例子中，Sys.WebForms.PageRequestManager.getInstance()方法是用来做什么的？ - Xaisoft

@Xaisoft - 它为我创建了2个JavaScript函数，这些函数在AJAX请求完成后运行，并在请求发送回服务器之前运行一个函数。这有助于验证等方面，使用一些jQuery UI组件和其他系统需求。 - RSolberg

刚接触 JavaScript，有点难以理解，但感谢提供的示例。 - Xaisoft

Answer 4

通过ScriptManager添加脚本的优点在于可以使用CompositeScript轻松地连接和压缩文件。不幸的是，这意味着它们将通过ScriptResource.axd引用页面，我始终认为这是一个极其丑陋的解决方案。

我更加希望将类似juicer的内容集成到我的构建过程中，但是无法超越ScriptManager的便利性。

- Adam Lassek

---

如果您有主控頁面，您是否只將ScriptManager放在主控頁面中？ - Xaisoft

这取决于你。如果你这样做，你可以在子页面上使用ScriptManagerProxy。 - Adam Lassek

好的，如果您将ScriptManager放在主页面中，那么您不能在使用主页面的页面上再放置另一个ScriptManager，而必须使用ScriptManagerProxy。对吗？ - Xaisoft

不，只有在需要为该页面使用额外的脚本时，您才需要在内容页上使用ScriptManagerProxy。 - Gordon Bell

是的，那就是我的意思，但是你不能使用两个ScriptManagers吗？ - Xaisoft

没错 - 你只能有一个ScriptManager。如果你需要在母版页之外的子页面上添加更多脚本，那么ScriptManagerProxy就可以做到这一点。 - Adam Lassek

Answer 5

不要忘记同时注册智能感知文件！这样有时会非常方便。

- Mark K.

---

我很好奇为什么我没有得到智能感知。我在哪里可以找到那个文件？ - Xaisoft

只需将vsdoc文件保存在与您的jquery-1.3.2-min.js或jquery-1.3.2.js相同的文件夹中即可。 - Gordon Bell

如果在执行上述操作后Intellisense仍然无法正常工作，您可能需要安装热修复程序： - Gordon Bell

http://weblogs.asp.net/scottgu/archive/2008/02/08/vs-2008-web-development-hot-fix-roll-up-available.aspx - Gordon Bell