微軟將 jQuery IntelliSense整合到Visual Studio

來源:互聯網
上載者:User

【原文地址】http://blog.joycode.com/scottgu/archive/2008/11/22/115357.aspx

上個月,我在部落格裡宣布了微軟將對jQuery提供支援。在過去的幾個星期裡,我們與jQueryTeam Dev合作,在Studio 2008 和 Visual Web Developer 2008 Express版本(免費的)中增加了很好的jQuery intellisense支援。現在這個支援可以下載使用了。

在VS 2008中啟用jQuery Intellisense的步驟

要在VS中啟用jQuery的intellisense完成,你要遵循三個步驟:

第一步: 安裝VS 2008 SP1

VS 2008 SP1 在Visual Studio中加了更豐富的JavaScript intellisense支援,對很大部分的JavaScript庫加了程式碼完成支援。

你可以在這裡下載VS 2008 SP1 和 Visual Web Developer 2008 Express SP1。

第二步: 安裝VS 2008 Patch KB958502以支援"-vsdoc.js"Intellisense檔案

2
個星期前,我們發布了一個補丁,你可以將其運用到VS 2008 SP1 和 VWD 2008 Express
SP1版本上,該補丁會導致Visual
Studio在一個JavaScript庫被引用時,尋找是否存在一個可選的"-vsdoc.js"檔案,如果存在的話,就用它來驅動
JavaScript intellisense引擎。

這些加了注釋的"-vsdoc.js"檔案可以包含對JavaScript方法提供了協助文檔的XML注釋,以及對無法自動推斷出的動態JavaScript簽名的另外的代碼intellisense提示。你可以在這裡瞭解該補丁的詳情。你可以在這裡免費下載該補丁。

第三步: 下載jQuery-vsdoc.js檔案

我們與jQueryTeam Dev合作編寫了一個jQuery-vsdoc.js檔案,該檔案對串聯的jQuery selector方法的JavaScript intellisense提供了協助注釋和支援。你可以在jQuery.com網站的官方下載網頁上下載jQuery和jQuery-vsdoc檔案:

把jquery-vsdoc.js儲存到你項目中jquery.js檔案所在的同一個目錄中(同時確認它的命名首碼與jquery檔案名稱匹配):

然後你可以象這樣,通過一個html <script/>元素來引用標準的jquery檔案:

或者也可以使用<asp:scriptmanager/> 控制項來引用它,或者在一個單獨的.js檔案的頂部加 /// <reference/> 注釋來引用它:

在完成之後,VS就會在你引用的指令檔所在的同一個目錄中尋找一個-vsdoc.js檔案,如果找到的話,就會用它來做協助和intellisense。

例如,我們可以使用jQuery來做一個基於JSON的get請求,得到該方法的intellisense(掛在$.之後):

以及 $.getJSON()方法參數的協助/intellisense:

 

如果你在方法調用中嵌套回呼函數的話,intellisense依舊會工作。例如,我們也許想對從伺服器返回的每個JSON對象進行迭代:

對每個項,我們可以執行另一個嵌套的回呼函數:

我們可以使用each回呼函數動態地往列表中附加一個新圖片(圖片的src屬性將指向返回的JSON媒體圖片的URL):

然後在每個動態產生的圖片上,我們可以串連一個點擊事件處理函數,在點擊時,會通過動畫效果來消失:

注意jQuery intellisense在我們代碼的每一個層次都很乾淨地做了提示。

JavaScript Intellisense 技巧和訣竅

Web工具Team Dev的Jeff King本星期早先時候撰寫了一個很棒的貼子,對有關VS 2008中JavaScript intellisense工作原理的若干常見的問題做了回答,我高度推薦閱讀該文。


談到的一個訣竅(我要在這裡做示範)是在你想要在使用者控制項/部分(.ascx檔案)中使用JavaScript
intellisense時可以使用的一個技術。經常地,你不想要在這些檔案中包括對JavaScript庫的<script
src=""/>
引用,這些引用往往是存在於使用了使用者控制項的主版頁面或內容網頁之上的。當然,問題是,你這麼做的話,在預設情形下VS是無法知道使用者控制項中用到了這個腳
本,因此不會為你提供intellisense 。

啟用intellisense的一個方法是,在你的使用者控制項中加<script src=""/>元素,但在其周圍加一個伺服器端的<% if %> 塊,在運行時其值總是為false:

在運行時,ASP.NET不會顯示這個指令碼標識(因為是包含在一個總是為false的if塊中的),但是,VS卻會運算這個<script/>標識,在使用者控制項中為它提供intellisense。在象使用者控制項這樣的情境下,這是個非常有用的技術。Jeff在他的FAQ貼子和原先的jQuery intellisense貼子裡還有更多細節。Rick Strahl在這裡也有一篇很好的貼子,是關於使用jQuery intellisense的。

更多資訊

想進一步瞭解jQuery的話,我建議觀看Stephen Walther在PDC大會上做的《ASP.NET和jQuery》講座。點擊這裡下載他的代碼常式和 powerpoint講義。

Rick Strahl也有一篇非常棒的《Introduction to jQuery》文章,討論如何在 ASP.NET使用jQuery。Karl Seguin 在這裡和這裡有2篇非常好的jQuery基礎教程貼子,對如何使用jQuery的一些基本知識提供了比較簡短的的概述。

我也高度推薦《 jQuery in Action》一書。

希望本文對你有所協助,

Scott

標籤: ASP.NET, Visual Studio, .NET, Atlas, Community News

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.