2012-05-28 117 views
11

我有一個ASP.net UserControl需要包含頁面包含對jQuery的引用。如何在ASP.net頁面中包含jQuery?

在古時,我也只會列入包含頁面jQuery的一個參考:

<HEAD> 
    <SCRIPT type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></SCRIPT> 
</HEAD> 

但我的用戶的jQuery的依賴是一個內部實現細節,不應該被泄漏到外面。我的userControl如何規定jQuery包含在最終頁面中?


研究這個,我發現很多混淆的解決方案,在不同的時間調用不同的函數。我不願意提及其中任何,因爲人們可能會認爲它們中的任何一個都是有效的。我希望正確答案,而不是一個有效的答案。

不同的解決方案涉及調用:

我的困惑是圍繞中心:

  • 我什麼時候想用RegisterClientScriptInclude VS RegisterStartupScript
  • 什麼時候我要在Page_Load vs Render vs PreRender期間叫它vs按鈕點擊?
  • 我該如何給RegisterXxxxScriptXxx"Scripts/jquery-1.7.2.min.js"

短版:如何轉換

<%@ Page Title="Home Page" Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" 
    Inherits="_Default" %><!DOCTYPE html> 
<html> 
<head runat="server"> 
    <script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script> 

用在用戶控件:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="MySuperCoolControl.ascx.cs" Inherits="Controls_MySuperCoolControl" %> 
+0

如果我做了一個自定義的控制,我將會把一個布爾變量的基礎上我控制自動註冊或不完整的jQuery庫。這樣我就讓最終用戶決定如何包含jQuery。我的自定義控件自動方式,或他的方式。 – Aristos

+0

你很困惑,因爲你沒有考慮你提到的每個解決方案處理不同情況(或多或少)。例如,框架包含的東西不會發生在頁面加載中(同時啓動緩存圖像,這可能依賴於框架)。 –

+0

我想說只有三個要考慮的是1,5和7.其他是基於實例或基於事件的情況,這不是應包含框架的地方。 –

回答

1

[如果你的用戶控件使用,這只是有關在內部。如果是分配,那麼它不會有很大幫助]

看看這個鏈接:

http://www.codeproject.com/Articles/196727/Managing-Your-JavaScript-Library-in-ASP-NET

文章建議創建方法生成的JavaScript庫如jQuery的引用,所以如果你想在頁面中使用它,你只需調用JavascriptLoader.IncludeJQuery()[或任何你所稱的方法]。

現在我所做的就是更進一步,通過在GAC中放置的程序集中創建這些方法,以便它可用於所有.net Web應用程序。現在,無論我在哪裏使用jQuery,該方法已經可用。最好的情況是,如果我在用戶控件中調用該方法,並在另一個用戶控件中再次調用該方法,並再次在頁面上調用該方法,則該方法仍然只會註冊該庫一次。如果我決定升級到更新版本的jQuery,我只需更改我的dll,並在任何地方進行更改。

2

您可以在UserControl上使用ScriptManagerProxy,在父頁面或母版頁上使用ScriptManager

How Do You Use ScriptManagerProxy In a custom ASP.NET Control

這會照顧「給RegisterXxxxScriptXxx路徑爲‘腳本/ jQuery的1.7.2.min.js’,並刪除需要在Page_Load中/ Page_PreRender事件擔心的。

至於「我什麼時候想用RegisterClientScriptInclude VS的RegisterStartupScript?」

RegisterClientScriptInclude註冊一個外部JS文件被包含在頁面中。RegisterStartupScript包括內嵌可執行腳本的頁面塊,這是不是在一個外部文件。

3

您可以使用谷歌託管的jQuery如下:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 
相關問題