ASP.NET Web编程入门-创建一个简单的Web页面

admin · 发表于 2024-2-29 08:43:36

一、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.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/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 内的后台服务器代码为空：

复制代码

四、运行一下程序，程序界面效果如下：

右键查看网页源代码如下：

<!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>
</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.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

复制代码

https://blog.csdn.net/cheshifei3571/article/details/100849058

3、

复制代码

个人理解：通知ASP.NET，这是运行在服务端上的代码，要转化为响应实例，最后要输出对应的HTML元素。

https://blog.csdn.net/longhaoyou/article/details/60960752

4、ropDownList ID="ddlEvent" runat="server" Height="18px" Width="141px">

复制代码

解释同上。

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>

复制代码

来源：https://blog.csdn.net/liang08114/article/details/117188913
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！

		自动登录	找回密码
密码			会员注册