Visual Studio 2008 JQuery的自動提示

【原文地址】jQuery Intellisense in VS 2008
【原文發表日期】 Friday, November 21, 2008 2:07 AM

上個月,我在博客裏宣佈了微軟將對jQuery提供支持。在過去的幾個星期裏,我們與jQuery開發團隊合作,在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文件

我們與jQuery開發團隊合作編寫了一個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工具開發團隊的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

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章