通过

Getting Started with jQuery in Visual Studio 2008

  • 项目

Getting Started with jQuery in Visual Studio 2008

jQuery IntellSense in Visual Studio 2008

In this post I’ll talk about adding jQuery IntellSense in Visual Studio 2008, and how to add jQuery to a simple Web Application inside Visual Studio 2008.

jQuery IntelliSense in Visual Studio 2008 - KB946581

In order to use jQuery in Visual Studio 2008 with IntelliSence a hotfix for Visual Studio 2008 must be installed:

  1. Download the hotfix from Connect
  2. Run the executable and extract its contents to a folder in your hard drive.
  3. Make sure all instances of Visual Studio 2008 are closed, and run VS90-KB946581.exe from the above folder.

Download the Latest jQuery Library + Documentation

To use jQuery in Visual Studio 2008, and enjoy its IntelliSense, you should download 2 javascript files. One contains the actual jQuery library, and the second contains the library with documentation for Visual Studio 2008 to display its IntelliSense.

  1. Go to jQuery Official Download Page
  2. Scroll down and find the Current Release section.
  3. Download the Uncompressed version (jquery-1.2.6.js) and the documentation for Visual Studio (jquery-1.2.6-vsdoc.js).

Using jQuery in a Visual Studio 2008 Web Application

jQuery IntelliSense in Visual Studio 2008 - KB946581In a new Web Application or inside an existing one, add the jQuery scripts into a certain folder.

In a web page (or a master page), add a reference to the jQuery library:

<head runat="server">

  <title>jQuery Sample</title>

 

  <script src="scripts/jquery-1.2.6.js" type="text/javascript" ></script>

 

</head>

Then, in any javascript function you can start using jQuery functions and enjoy the IntelliSense in Visual Studio 2008.

jQuery IntelliSense in Visual Studio 2008 - KB946581

A Simple Example of Using jQuery Functions

For example, Assuming that you have a page with the following content in it:

<form id="form1" runat="server">

<div>

  <input type="text" class="inputs" id="txtName"
         value="Enter Text Here" />

  <input type="button" class="inputs" id="btnSubmit"
         value="Click Me" onclick ="handleButtonClick(); " />

</div>

</form>

This form contains a single textbox followed by a button.

jQuery IntelliSense in Visual Studio 2008 - KB946581

The handleButtonClick() function handles the button onclick event.

<script type="text/javascript">

  function handleButtonClick() {

  }

</script>

The way jQuery works is by selecting DOM elements and then doing something with them, such as executing a function or applying some properties. For example:

<script type="text/javascript">

  function handleButtonClick() {

    $("#txtName").css("border", "solid 2px red");

  }

</script>

The above method uses the selector function $ to select DOM elements (in this case – a single element with id = txtName) and to apply a style property of a red border. Running this page and clicking the button results in this output:

jQuery IntelliSense in Visual Studio 2008 - KB946581

Summary

In this post I talked about the steps you should follow in order to use jQuery in Visual Studio 2008 with InstelliSense support. Then, we used jQuery in a simple web application.

Comments

  • Anonymous
    June 05, 2009
    Very helpful..Thanks Guy. ;-) ... Getting Started with jQuery in Visual Studio 2008 In this post I’ll
  • Anonymous
    June 05, 2009
    Thank you for submitting this cool story - Trackback from DotNetShoutout
  • Anonymous
    July 31, 2009
    This is great! Is there a way to make intellisense part of the VS2008? Adding reference to 100s of files is not so cool.