.NET MVC一起使用jQuery

jquery是一款容易上手的javascript库，任何平台都可以使用，它跟asp.net mvc框架的结合尤为引人瞩目。james estes曾在infoq上发表过一篇文章，名为jquery正在靠1.2版及jquery ui赢得人心，谈到了jquery最近的一次发布，并介绍了很多杰出的特性。

藉由asp.net mvc内置的扩展性，开发人员便可以使用第三方库，例如jquery。在使用asp.net webforms的时候，如果使用jquery而不是asp.net ajax，难度会比较大。

刚开始撰写本文的时候，asp.net mvc的版本是preview 4，有些在preview 4中使用的技术可能无法在早期版本中正常工作。preview 4可以在codeplex上下载。

初步配置

我不打算把它写成一篇完整的jquery指南，只是简单给出几个跟asp.net mvc一起使用这款javascript库的示例。chad myers有一篇很精彩的指南，包括了如何上手。

首先要保证你有asp.net mvc，所以请先从codeplex上下载安装(注意：你需要运行visual studio 2008才能使用asp.net mvc框架)。

asp.net mvc框架装好以后，就应该已经创建好了一个新的asp.net mvc web application工程。

下一步，下载jquery，下载packed或者是minified版本，然后放到上面那个工程的content目录下。

添加一个对content目录下jquery文件的引用。

简单示例

ryan lanciaux写过一篇很优秀的文章，名为jquery和asp.net mvc框架，其中列出了很多在asp.net mvc框架中使用jquery的关键因素。ryan在文章中进行了详细阐述：

首先要做的就是创建一个asp.net mvc(preview 4)工程，在home controller下面创建一个新的view和一个controller action，然后把下面几行字加到view中。

this is red text,this is blueand this is green

右键点击controllers文件夹，选择“add new item”，然后选择mvc controller类，任务完成。下一步是创建一个controller action：

接下来，我们需要创建一个controller action，它可以从model中返回色素值。而且我们不希望重载页面，我们希望使用ajax。很幸运，在mvc框架中我们可以使用jsonresult类型来完成这一点。

public jsonresult rgbcolors(){ colors.rgb color = new colors.rgb(); return json(color);}

下一步，创建一个类，用来表示model中的颜色：

namespace colors{ public class rgb { public string red = “#ff0000″; public string green = “#00ff00″; public string blue = “#0000ff”; }}

最后一步，用一些jquery代码把一切组装在一起：

ryan指出了一处重要的地方：

注意，jquery代码是在我们的controller上调用json方法。如果我们重载页面，它就会得到model中定义的色素值。完全无痛。它很简单，但在web上使用的时候却可以千变万化。

上面这个例子简单演示了如何使用json，ryan和他的兄弟joel写了一个theme generator tool，里面有完整的应用。另外敬请留意，在撰写本文的过程中，微软已经发布了asp.net mvc框架的preview 5版本。