[翻译：ASP.NET MVC 教程]创建自定义HTML辅助函数
本教程的目标是向你演示怎样在MVC视图中创建可使用的自定义HTML辅助函数。通过利用HTML辅助函数，你可以减少创建标准HTML页面时必须键入的冗长的HTML标签的数量。
在本教程的第一部分，我将描述包含在ASP.NET MVC框架中一些现存的HTML辅助函数。接着，我将描述两种创建自定义HTML辅助函数的方法：通过创建静态方法以及通过创建扩展方法来创建自定义HTML辅助函数。
理解HTML辅助函数
HTML辅助函数就是一个返回字符串的方法。字符串能代表你想要的任何类型的内容。例如，你可以使用HTML辅助函数来呈现像<input>和<img>这样的标准HTML标签。你也可以使用HTML辅助函数来呈现更为复杂的内容，诸如多面板选项卡或是数据库记录的HTML表格。
ASP.NET MVC框架包含了下列一套标准的HTML辅助函数（这并不是完整的列表）：
- Html.ActionLink()
- Html.BeginForm()
- Html.CheckBox()
- Html.DropDownList()
- Html.EndForm()
- Html.Hidden()
- Html.ListBox()
- Html.Password()
- Html.RadioButton()
- Html.TextArea()
- Html.TextBox()
例如，考虑清单1中的表单。该表单为两个标准的HTML辅助函数所呈现（见图1）。该表单使用Html.BeginForm()和Html.TextBox()辅助函数方法来呈现一个简单的HTML表单。
图1：用HTML辅助函数所呈现的页面
清单1——Views\Home\Index.aspx
<%@ Page Language="C#" AutoEventWireup="false" CodeBehind="Index.aspx.cs" Inherits="MvcApplication1.Index" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Index</title>
</head>
<body>
<div>
<form action="http://localhost:33102/" method="post">
<label for="firstName">First Name:</label>
<br />
<input id="firstName" name="firstName" type="text" value="" />
<br /><br />
<label for="lastName">Last Name:</label>
<br />
<input id="lastName" name="lastName" type="text" value="" />
<br /><br />
<input id="btnRegister" name="btnRegister" type="submit" value="Register" />
</form>
</div>
</body>
</html>
Html.BeginForm()辅助函数方法是被用来创建闭合HTML标签<form>的。注意到Html.BeginForm()方法用using语句被调用。using语句确保<form>标签在using语句块的结尾关闭。
如果你愿意，你可以调用Html.EndForm()辅助函数方法来关闭<form>标签以替代using语句块。使用两者之一来创建闭合<form>标签由你的直觉而定。
在清单1中被使用的Html.TextBox()辅助函数方法是用来呈现HTML <input>标签的。如果你在浏览器中选择查看源代码，那么你将见到清单2中的HTML源。注意到该源包含标准HTML标签。
重要：注意到Html.TextBox()辅助函数方法是以<%= %>标签的形式而不是以<% %>的形式所呈现的。如果你没有包含等号，那么浏览器将不呈现任何内容。
ASP.NET MVC框架包含一套小型的辅助函数。多数情况下，你需要通过自定义HTML辅助函数来扩展MVC框架。在本教程之前所提到的，你将了解到两种创建自定义HTML辅助函数的方法。
清单2——Index.aspx源代码
<%@ Page Language="C#" AutoEventWireup="false" CodeBehind="Index.aspx.cs" Inherits="MvcApplication1.Index" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Index</title>
</head>
<body>
<div>
<form action="http://localhost:33102/" method="post">
<label for="firstName">First Name:</label>
<br />
<input id="firstName" name="firstName" type="text" value="" />
<br /><br />
<label for="lastName">Last Name:</label>
<br />
<input id="lastName" name="lastName" type="text" value="" />
<br /><br />
<input id="btnRegister" name="btnRegister" type="submit" value="Register" />
</form>
</div>
</body>
</html>
使用静态方法来创建HTML辅助函数
创建一个新的HTML辅助函数的最简单的方法便是创建一个返回字符串的静态方法。设想一下，例如，你决定创建一个呈现HTML标签<label>的HTML辅助函数。你可以使用清单1中的类来呈现一个<label>标签。
清单1——Helpers\LabelHelper.cs
using System;
namespace MvcApplication1.Helpers
{
public class LabelHelper
{
public static string Label(string target, string text)
{
return String.Format("<label for='{0}'>{1}</label>", target, text);
}
}
}
清单1中的类并没有什么特别之处。Label()方法简单地返回了一个字符串。
清单2中修改过的Index视图使用LabelHelper来呈现HTML标签<label>。注意到这个包含<%@ imports %>页面指令的视图引入了Application1.Helpers命名空间。
清单2——Views\Home\Index2.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index2.aspx.cs" Inherits="MvcApplication1.Views.Home.Index2"%>
<%@ Import Namespace="MvcApplication1.Helpers" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Index2</title>
</head>
<body>
<div>
<% using (Html.BeginForm())
{ %>
<%= LabelHelper.Label("firstName", "First Name:") %>
<br />
<%= Html.TextBox("firstName")%>
<br /><br />
<%= LabelHelper.Label("lastName", "Last Name:") %>
<br />
<%= Html.TextBox("lastName")%>
<br /><br />
<input type="submit" value="Register" />
<% } %>
</div>
</body>
</html>
使用扩展方法来创建HTML辅助函数
如果你想要创建像包含在ASP.NET MVC框架中的标准HTML辅助函数那样工作的HTML辅助函数，那么你需要创建扩展方法。控制方法让你向现存的类中添加新方法。当创建一个HTML辅助函数时，你向代表视图Html属性的HtmlHelper类中添加了方法。
清单3中的类向HtmlHelper类中添加了一个名为Label()的扩展方法。对于该类，有不少事是你应当注意的。首先，注意到该类是一个静态类。你必须用静态类来定义一个扩展方法。
其次，注意到Label()方法的第一个参数是由关键字this所引出的。该扩展方法的第一个参数表示该扩展方法继承自该类（即HtmlHelper）。
清单3——Helpers\LabelExtensions.cs
using System;
using System.Web.Mvc;
namespace MvcApplication1.Helpers
{
public static class LabelExtensions
{
public static string Label(this HtmlHelper helper, string target, string text)
{
return String.Format("<label for='{0}'>{1}</label>", target, text);
}
}
}
在你创建完扩展方法，并且成功编译你的应用程序后，该扩展方法会像其它所有类的方法一样出现在Visual Studio代码智能提示中（见图2）。唯一的区别在于这些扩展方法以特殊的图符（一个下载箭头图标）缀前出现。
图2：使用Html.Label()扩展方法
在清单4中修改过的Index视图使用Html.Label()扩展方法来呈现视图中所有的<label>标签。
清单4——Views\Home\Index3.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index3.aspx.cs" Inherits="MvcApplication1.Views.Home.Index3" %>
<%@ Import Namespace="MvcApplication1.Helpers" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Index3</title>
</head>
<body>
<div>
<% using (Html.BeginForm())
{ %>
<%= Html.Label("firstName", "First Name:") %>
<br />
<%= Html.TextBox("firstName")%>
<br /><br />
<%= Html.Label("lastName", "Last Name:") %>
<br />
<%= Html.TextBox("lastName")%>
<br /><br />
<input type="submit" value="Register" />
<% } %>
</div>
</body>
</html>
小结
在本教程中，你了解到创建自定义HTML辅助函数的两种方法。首先，你了解到怎样通过创建返回字符串的静态方法来创建一个自定义HTML辅助函数Label()。接着，你了解到怎样通过在HtmlHelper类上创建扩展方法来创建一个自定义HTML辅助函数Label()。
在本教程中，我集中于构建一个极为简单的HTML辅助函数方法。意识到HTML辅助函数的复杂度可以由你掌控。你可以构建呈现富文本，诸如树状视图、菜单或是数据库数据表格这样的HTML辅助函数。
文章出处：Kinglee’s Blog (http://www.cnblogs.com/Kinglee/)
版权声明：本文的版权归作者与博客园共有。转载时须注明本文的详细链接，否则作者将保留追究其法律责任。
如对本文有疑问，请提交到交流论坛，广大热心网友会为你解答！！ 点击进入论坛
