3.2 代码内联与后台编码

ASP.NET很容易做到用户界面和内容的分离,因为Web窗体模型是基于Web用户界面和实现逻辑分离技术实现的。用户界面含有页面布局信息和服务器控件的HTML模板,负责对浏览器上的Web窗体进行显示,这部分可以由专门负责界面设计的工作人员完成;实现逻辑是对Web窗体进行逻辑处理的ASP.NET代码,负责生成页面的动态内容部分,这部分可以由程序设计人员完成。当页面被请求时,服务器会将用户界面和实现逻辑联合起来执行,生成用户浏览器中看到页面的HTML代码。那么,读者不禁要问,这两部分是如何联系起来的呢?

ASP.NET是通过代码内联和后台编码这两种形式来实现用户界面和实现逻辑的联系的。代码内联就是将用户界面和实现逻辑放在同一个文件中,后台编码就是将实现逻辑和用户界面分别存在两个不同的文件中。

ASP.NET 3.5默认创建的页面是页面显示代码和逻辑处理代码相分离的,在添加新页面时,可以选择采用代码内联或后台编码模式,如图3.8所示。当选中“将代码放在单独的文件中”复选框时,新建的页面即为后台编码模式,否则为代码内联模式。

图3.8 选择代码的存储模式

3.2.1 后台编码

通过以上学习用户知道了Visual Studio 2008创建的Web窗体是由两个文件组成的,这两个文件分别保存了页面的显示部分和实现逻辑代码,其中一个文件是Default.aspx(扩展名是.aspx),另一个文件是Default.aspx.cs(扩展名是.cs)。需要注意的是,实现逻辑的代码文件保存类型要根据所使用的语言来确定,本教材使用的是C#语言,因此,实现逻辑的代码文件类型为.cs。如果使用的语言是VB.NET,那么实现逻辑的代码文件类型将为.vb。当执行ASP.NET页面时,这两个文件会编译生成一个可执行的Page对象,那么编译器是如何知道应该将这两个文件联系起来进行编译呢?

在Default.aspx文件的内容中,在第一行有一句代码:

              <%@ Page Language="C#" AutoEventWireup=
              "true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

每个.aspx文件都包含一个@Page指令,上面的代码中列出了@Page指令常用的属性。

● Language="C#":指定了该页面所使用的语言为C#。

● AutoEventWireup="true":指定了该页面的事件是动执行。

● CodeFile="Default.aspx.cs":指定了该页面所关联的后台处理代码文件。

● Inherits="_Default":定义供页继承的隐藏代码类,可以是从Page类派生的任意类,如该页继承于Default类。

通过@Page指令中的CodeFile和Inherits属性,将页面Default.aspx文件与包含代码实现细节的类文件Default.aspx.cs文件连接起来。

在Default.aspx.cs文件的内容中,第一行代码为:

              public partial class _Default : System.Web.UI.Page

该行代码指出了当前页面是一个类,名为Default,该类派生于System.Web.UI.Page,即Default类是Page类的派生类。在后台代码文件中还用到了服务器控件的ID属性,如btn1,这样,后台编码文件中的Default类和Default页面中的服务器控件实例之间通过控件的ID属性,将Default类中的控件对象与页面中的控件连接起来,实现了Default.aspx.cs文件与Default.aspx文件的连接。

综上所述,编译器通过@Page指令将页面文件与实现逻辑代码文件连接起来,通过控件的ID属性将Page类中的控件对象与页面中的控件连接起来。

注意:在Visual Studio 2008工具中,默认使用后台编码模型。用户不用担心页面文件与实现逻辑代码文件之间的连接,开发工具的应用程序生成向导会自动实现后台编码形式的代码分离并连接两个文件。

3.2.2 代码内联

代码内联是将用户界面与逻辑实现部分的代码放在一个文件之中,但是逻辑部分和页面部分还是明显地区分为两部分。其中,逻辑部分包含在<script>…</script>标记内,并为标记添加了runat="server"属性;用户界面部分包含在<html>…</html>标记中,在<form></form>标记中添加了runat="server"属性。下面通过一个简单的Web页面例子,给出内联代码的格式。

【例3.2】在例3.1中添加新页面In_Page.aspx,页面采用代码内联模式。

在站点ch3_1中添加一个页面,新建页面采用代码内联模式,即取消对“将代码放在单独的文件中”复选框的选择,将页面命名为In_Page.aspx,如图3.9所示。

在此模式中,自动添加了用于编写逻辑实现代码的<script runat = "server" > </script>标记。In_Page.aspx文件的内容如下:

              <%@ Page Language="C#" %>
              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
              "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
              <script runat="server">
                  void btn1_Click(Object sender, EventArgs e)
                  {
                          lbl1.Text = TextBox1.Text + "同学您好!";
                  }
              </script>
              <html xmlns="http://www.w3.org/1999/xhtml" >
              <head id="Head1" runat="server">
                  <title>内联代码模式</title>
              </head>
              <body>
                  <form id="form1" runat="server">
                  <div>
                          <asp:Label ID="lbl1" runat="server" Width="304px"></asp:Label>
              <br /> <br />
                          <asp:Label ID="lbl2" runat="server" Text="请输入您的姓名:" Width=
              "136px"></asp:Label> 
                          <asp:TextBox ID="TextBox1" runat="server" Width=
              "72px"></asp:TextBox>  
                          <asp:Button ID="btn1" runat="server" OnClick="btn1_Click"
              Text="请按我一下" />
                  </div>
                  </form>
              </body>
              </html>

图3.9 添加新页面In_Page.aspx

仔细阅读这个文件,页面显示部分原封不动地将Default.aspx中<html>标记内的内容复制到了这个文件中,只是在<asp:Button id="btn1" …>中增加了粗体部分代码。代码的逻辑实现部分放在<script>…</script>标记中,用户只编写了按钮的单击事件处理过程(btn1_Click)的处理代码。在浏览器中显示这个页面,运行结果和例3.1的运行结果是一样的。

提示:当应用程序中有多个页面时,为了浏览其中的某个页面,在解决方案资源管理器中右击该页面,在弹出的快捷菜单中选择“设为起始页”选项,该页面即作为应用程序要启动的第一个页面。当应用程序中有一个页面时,该页面默认为起始页;当应用程序中有多个页面时,每个页面都必须在调试运行前将其设为起始页。

除了Visual Studio 2008开发工具以外,编写ASP.NET应用程序也可使用其他的编辑器,记事本就是其中最简单的一个,它是Windows操作系统自带的一个文本编辑工具。另外,还有Macromedia Dreamweaver MX、Web Matrix等。Macromedia Dreamweaver MX是Macromedia公司的软件产品,是比较完善的开发ASP.NET程序的软件产品;Web Matrix是Web社区支持的完全免费的工具。