网站建设
  简约型网页设计套餐998
  实惠型网站建设套餐2580
  综合型网站制作套餐4980
  网站改版与网站维护
  行业网站建设方案
  大型网站建设解决方案
  企业网站建设流程
  帝网科技网站设计与网站制作
建站FAQ
·网站空间问题解答
·企业邮箱问题解答
 
酷站欣赏
·房产酷站(379)
·综合门户(8 9)
·建筑装饰(603)
·手机通讯(354)
·生活购物(376)
·医疗保健(199)
·文化摄影(602)
·休闲体育(399)
>>更多酷站欣赏
网站优化
·Google(谷歌)优化   ·百度(BaiDu)优化
·雅虎(Yahoo)优化    ·Alexa排名优化   
·Google AdSense   ·DMOZ目录提交  
建站知识
·网站建设知识·网站名词解释·网站运营知识
·网络营销知识·搜索引擎知识·实用技术文摘
网站推广
百度网站推广 google网站推广
搜狐网站推广 网易网站推广
新浪网站推广   雅虎网站推广
  您当前位置: 当前位置:帝网科技 >> web开发 >> .NET专栏 >> 浏览文章
 
 
跟ASP.NET MVC一起使用jQuery
作者:袁袁整理 来源:帝网科技 日期:2008年11月02日 点击数:



jQuery是一款容易上手的javascript库,任何Web开发平台都可以使用,它跟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代码把一切组装在一起:

以下为引用的内容:
         $(document).ready(function()
     { $.getJSON(“/Home/RGBColors”,

     {},

      function(data)

      { $(“.red”).css(“color”, data.Red); $(“.blue”).css(“color”, data.Blue);

      $(“.green”).css(“color”, data.Green); });});
 


Ryan指出了一处重要的地方:

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

上面这个例子简单演示了如何使用JSON,Ryan和他的兄弟Joel写了一个Theme Generator Tool,里面有完整的应用。另外敬请留意,在撰写本文的过程中,微软已经发布了ASP.NET MVC框架的Preview 5版本。

 

  相关文章
 
·ASP.NET使用log4Net日志组件教程(日志
·ASP.NET MVC 框架
·C#实现的BinaryTree
·WebForms使用System.Web.Routing
·ASP.NET获取远程网页下载到本地文件
·一个“简单”的ASP.NET的服务器控件
·ASP.net与PHP两大网站开发架构优势对比
·教你七招提高.NET网站性能
·ASP.NET未来:简化开发 HTML5性能提升
·ASP.NET实现类似Excel的数据透视表
·FileUpload上传多文件出现错误的解决方
·.NET从优酷专辑中采集所有视频及信息(
·ASP.NET 4中的SEO改进
·详解Asp.net MVC DropDownLists
·提高ASP.NET应用程序性能的几招方法
·asp.net实现51job地区选择效果
·ASP.NET中创建GeoRSS订阅源
·ASP.NET 4.0开发更加简便
·ASP.NET页面间数据传递的方法
·ASP.NET的SEO:使用.ashx文件——排除
 
 

公司环境 | 合作伙伴 | 人才招聘 | 付款方式 | 关于我们

地址:广州市天河区中山大道中120号D805 电话:020-82529556 传真:020-82529556
广州帝网网络科技有限公司 版权所有 粤ICP备08119341号