一、VS2010 新建一个ASP.NET Empty Web Application项目。
二、添加一个Web Form页面,命名为:Registration2.aspx。
三、在Registration2设计视图拖拽添加一些控件并设置属性,完成后如下:
源代码视图如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Registration.aspx.cs" Inherits="EventRegistration2.Registration" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.style1
{
width: 100%;
}
.style2
{
width: 100px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table class="style1">
<tr>
<td class="style2">
Event</td>
<td>
<asp:DropDownList ID="ddlEvent" runat="server" Height="18px" Width="141px">
<asp:ListItem>Introduction to ASP.NET</asp:ListItem>
<asp:ListItem>Introduction to Windows Azure</asp:ListItem>
<asp:ListItem>Begin Visual C# 2012</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="style2">
First Name</td>
<td>
<asp:TextBox ID="tbFirstName" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style2">
Last Name</td>
<td>
<asp:TextBox ID="tbLastName" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style2">
Email</td>
<td>
<asp:TextBox ID="tbEmail" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style2">
</td>
<td>
<asp:Button ID="Submit" runat="server" Text="Button" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
暂时还没有为控件添加任何事件,所以 Registration.aspx.cs 内的后台服务器代码为空:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace EventRegistration2
{
public partial class Registration : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
}
四、运行一下程序,程序界面效果如下:
右键查看网页源代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
<head><title>
</title>
<style type="text/css">
.style1
{
width: 100%;
}
.style2
{
width: 100px;
}
</style>
</head>
<body>
<form method="post" action="./Registration.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUIMTM3Mzk3MjZkZJYdyRPSR1fS3wIBns38y8R8czT2Dlju32C7+sy0efgW" />
</div>
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="0E6B69E9" />
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEdAAU3x8qG70K7aKeu+2fztW1k0fMME9lwpgVXR7Bj0XM58GPMnjboa62QCFz6XwjsGoCW9cfhXMGEAsxjutrqH9VId8BcWGH1ot0k0SO7CfuulMVY8fYmjPtfc0dnKrVTJ+1t1WNfWb9yRU+s50eLQgoC" />
</div>
<div>
<table class="style1">
<tr>
<td class="style2">
Event</td>
<td>
<select name="ddlEvent" id="ddlEvent" style="height:18px;width:141px;">
</select>
</td>
</tr>
<tr>
<td class="style2">
First Name</td>
<td>
<input name="tbFirstName" type="text" id="tbFirstName" />
</td>
</tr>
<tr>
<td class="style2">
Last Name</td>
<td>
<input name="tbLastName" type="text" id="tbLastName" />
</td>
</tr>
<tr>
<td class="style2">
Email</td>
<td>
<input name="tbEmail" type="text" id="tbEmail" />
</td>
</tr>
<tr>
<td class="style2">
</td>
<td>
<input type="submit" name="Submit" value="Button" id="Submit" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
五、要点
1、Registration.aspx文件说明
Page指令:Registration.aspx文件的第一行
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Registration.aspx.cs" Inherits="EventRegistration2.Registration" %>
Language:编程语言;
AutoEventWireup=“true”:表示页面的事件处理程序自动连接到特定的方法名上;
Inherits="EventRegistration2.Registration",表示ASPX文件中动态生成的类派生与基类EventRegistration2.Registration,这个基类位于CodeBehind指定的文件内;
2、文档类型声明:XHTML(Registration.aspx文件的第二、三行)
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Registration.aspx.cs" Inherits="EventRegistration2.Registration" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
https://blog.csdn/cheshifei3571/article/details/100849058
3、<form id="form1" runat="server">
<body>
<form id="form1" runat="server">
<div>
<table class="style1">
<tr>
<td class="style2">
Event</td>
<td>
<asp:DropDownList ID="ddlEvent" runat="server" Height="18px" Width="141px">
<asp:ListItem>Introduction to ASP.NET</asp:ListItem>
<asp:ListItem>Introduction to Windows Azure</asp:ListItem>
<asp:ListItem>Begin Visual C# 2012</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="style2">
First Name</td>
<td>
<asp:TextBox ID="tbFirstName" runat="server"></asp:TextBox>
</td>
</tr>
个人理解:通知ASP.NET,这是运行在服务端上的代码,要转化为响应实例,最后要输出对应的HTML元素。
https://blog.csdn/longhaoyou/article/details/60960752
4、<asp:DropDownList ID="ddlEvent" runat="server" Height="18px" Width="141px">
<asp:DropDownList ID="ddlEvent" runat="server" Height="18px" Width="141px">
<asp:ListItem>Introduction to ASP.NET</asp:ListItem>
<asp:TextBox ID="tbFirstName" runat="server"></asp:TextBox>
解释同上。
5、最后可见,服务端返回给客户端的HTML中是没有runat="server 和 asp:***的
<form method="post" action="./Registration.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMjEyOTg0Mjg3M2RksgyM+Ct8pfiG5QVc9EMRCaCcLti2gpgsZXQJN1QIBKM=" />
</div>
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="0E6B69E9" />
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEdAAgzXAEXqQDfASEq1ySKpd5RMTQJkvmQgAJqS9DcCRIg8889lYeFJo4C5E2Of0jt+xdqgRvUMSslP8U4uBbGrMF60fMME9lwpgVXR7Bj0XM58GPMnjboa62QCFz6XwjsGoCW9cfhXMGEAsxjutrqH9VId8BcWGH1ot0k0SO7CfuulIZ1WJ0D+/daakG3ZAJoIPfGBrCPmlfw6yZ+h0IdQwBG" />
</div>
<div>
<table class="style1">
<tr>
<td class="style2">
Event</td>
<td>
<select name="ddlEvent" id="ddlEvent" style="height:18px;width:141px;">
<option selected="selected" value="Introduction to ASP.NET">Introduction to ASP.NET</option>
<option value="Introduction to Windows Azure">Introduction to Windows Azure</option>
<option value="Begin Visual C# 2012">Begin Visual C# 2012</option>
</select>
</td>
</tr>
<tr>
<td class="style2">
First Name</td>
<td>
<input name="tbFirstName" type="text" id="tbFirstName" />
</td>
</tr>
<tr>
<td class="style2">
Last Name</td>
<td>
<input name="tbLastName" type="text" id="tbLastName" />
</td>
</tr>
更多推荐
ASP.NET Web编程入门-创建一个简单的Web页面
发布评论