ASP.NET 网站建设之代码分离
刘峰 2005-1-20
在我们传统的网站建设中通常是先设计网站页面，再利用开发工具，在网站的框架内进行功能设计。这样的网站建设存在很多弊端，其中最突出的缺点是不利于小组共同开发，各环节之间依赖性太强。
在 ASP.NET 中我们可以利用后台编码，把 HTML 用户界面设计（颜色、美学等）与页面代码区分开来。这样就可以解决我们小组的并行开发问题。
其主题思想是：美工来进行网站页面的设计，程序员对网站要实现的功能分模块开发。待到页面和功能模块开发完毕后，我们只要在美工界面中对其 HTML 代码稍加修改，就可以完成对应的功能。
下面就用一个小例子来进行说明。
程序员完成的功能有如下模块：
1. 在左边的 Column1 处点击，中间的三个内容显示小组三条新闻
2. 在 Column2 处点击，中间的三个内容显示三个人员情况
3. 在 Column3 处点击，弹出一个窗口显示一张照片。
为了测试，我们可以将这三个功能分别交给两个程序员来做。
甲程序员：完成模块 1 和 2
1． 甲可以先建立一个 WebApplication, 在界面上放入两个 ImageButton:IBtnNews ， IBtnMember 和六个 Label:Lb1Title,Lb1Detail, Lb2Title,Lb2Detail, Lb3Title,Lb3Detail 。生成一个 Web 应用程序，点击 IBNews, 六个 Label 显示小组新闻，点击 IBMember, 六个 Label 显示小组三名成员。这样我们就为建立源文件创建好了条件。
2． 我们建立一个 C# 类文件 CodeBehind.cs 。
3． 由于我们是建立的 Web 程序，则需要在添加引用中，添加 System.Web.dll 应用。
4． 去掉构造函数，因为后台编码不需要创建类。
5． 让类从 Page 对象上继承功能，即
public class CodeBehind:System.Web.UI.Page
6． 将刚才生成的 WebApplication 中的相关代码复制进来，主要有两个部分：声明部分和方法部分，在这里把应用程序中的可访问级别 protected ，改为 public ，因为只有这样外部的代码才可以访问我们的方法和变量，要注意的是页面上所有与后台编码文件交户的控件都要有一个对应的本地变量。
7． 生成一个 CodeBehind.cs 。
至此，甲程序员的工作完成。乙程序员可以用同样的方式生成他的 CodeBehind.cs 文件。甲乙两位程序员进行代码合成，完成一个完整的 CodeBehinde.cs;
代码如下：
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace codetest
{
public class News:System.Web.UI.Page
{
public System.Web.UI.WebControls.Label Lb1Title;
public System.Web.UI.WebControls.Label Lb1Detail;
public System.Web.UI.WebControls.Label Lb2Title;
public System.Web.UI.WebControls.Label Lb2Detail;
public System.Web.UI.WebControls.Label Lb3Title;
public System.Web.UI.WebControls.Label Lb3Detail;
public System.Web.UI.WebControls.ImageButton IBtnNews;
public System.Web.UI.WebControls.ImageButton IIBtnMember;
public System.Web.UI.WebControls.ImageButton IBtnContact;
public void IBtnNews_Click( object sender, System.Web.UI.ImageClickEventArgs e)
{
…………………………
}
public void IIBtnMember_Click( object sender, System.Web.UI.ImageClickEventArgs e)
{
…………………………
}
public void IBtnContact_Click( object sender, System.Web.UI.ImageClickEventArgs e)
{
string strScript="
1<script language="javascript">\n";
2
3strScript+="window.alert("+"\" 电话： 66763467\""+");";
4
5strScript+="</script>
";
Response.Write(strScript);
}
}
}
下面我们来说明如何将建好的后台代码和美工好的网页结合起来。
1． 集成工程师生成一个新的 WebApplication ，将 CodeBehind.cs 文件保存在 bin 目录下，并将其加入引用。
2． 集成工程师将美工好的网页的图片加入对应的引用，复制 HTML 代码，放入新的 WebApplication 的页面中，这样，我们就可以看到美工好的页面展现在我们的 .aspx 文件中。
3． 更改页面最上面的黄色代码，其中 Codebehind="CodeBehind.cs" ：让页面后台支持的代码指向我们写好的 cs 文件。 Inherits="codetest.CodeBehind" ：让页面继承于类 CodeBehind 中的功能， codetest 为我们定义的名词空间。
4． 在 HTML 代码中
1<body> 内填入 < form id="Form1" method="post" runat="server"> 在 </body>
上面加上 。
5． 相对应的地方拖入 Web 控件，注意这里的 ID 要与 cs 文件中的定义对应。
6． 在 HTML 代码中，找到 Web 控件，添加对应的方法名称。
这样就结合完毕。运行看看效果如何。
大家看上面在改动 HTML 代码的时候稍显麻烦，我们还有一种更简单的方法，只要在后台文件中加入几行代码，我们就不必在 HTML 中找到控件的位置，加入事件引用了。
在后台文件中加入
protected override void OnInit(EventArgs e)
// 此方法引发 Init 事件，当服务器控件初始化是发生。
{
初始化控件方法（）
base.OnInit(e);
}
private void 初始化控件方法（） ;
{
this. 控件名 .Click+=new EventHandler( 控件事件响应方法 );
}
上面两个方法的加入，我们可以看到，只要我们在后台代码中加入初始化控件的方法，就可以将对应的事件加入进去，而不用在 HTML 代码中加入事件引用了。同样，我们将常用的 Page_Load 事件也可以实现
只要加入：
Private void Page_Load(object sender,System.EventArgs e)
{
代码；
}
private void 初始化控件方法（） ;
{
this. 控件名 .Click+=new System.EventHandler( 控件事件响应方法 );
this.Load+=new System.EventHandler(this.Page_Load);
}
EventHandler: 是表示将处理不包含事件数据的事件的方法。
控件事件响应方法只要符合：方法名（ object sender,System.EventArgs e ）就可以。
目前存在的问题：
1． 如何保持美工所作的效果不因使用了 Web 控件而受影响。
2． 多人在做同一个网页的时候，只能通过合并 cs 文件的方法来集成后台代码。不利于代码的维护。