下面给你一个完整的 ASP.NET Web Forms 从零开始的简单实例,包含所有必要文件,帮助你快速跑通一个项目。
1. 创建项目(Visual Studio 2022/2019)
- 打开 Visual Studio
- 文件 → 新建 → 项目
- 选择 “ASP.NET Web 应用程序 (.NET Framework)”
- 项目名称随便取,例如:WebFormsDemo
- 框架选择 .NET Framework 4.8(或最新的 4.x)
- 模板选择 “Web Forms” → 创建
Visual Studio 会自动生成一个完整可运行的项目。
2. 最经典的“计数器”实例(带 ViewState)
Default.aspx(前端页面)
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebFormsDemo.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>ASP.NET Web Forms 计数器示例</title>
</head>
<body>
<form id="form1" runat="server">
<div style="font-family: Arial; padding: 50px;">
<h2>欢迎使用 ASP.NET Web Forms</h2>
<p>你已经点击按钮 <asp:Label ID="lblCount" runat="server" Font-Bold="true" ForeColor="Red">0</asp:Label> 次</p>
<asp:Button ID="btnClick" runat="server" Text="点击我 +1"
OnClick="btnClick_Click" CssClass="btn" />
<br /><br />
当前时间(服务器时间):
<asp:Label ID="lblTime" runat="server"></asp:Label>
</div>
</form>
</body>
</html>
Default.aspx.cs(代码隐藏文件)
using System;
namespace WebFormsDemo
{
public partial class Default : System.Web.UI.Page
{
// ViewState 会自动保持这个值在多次回发之间
protected int ClickCount
{
get { return (int)(ViewState["ClickCount"] ?? 0); }
set { ViewState["ClickCount"] = value; }
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
// 第一次加载页面时执行
lblTime.Text = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
lblCount.Text = "0";
}
else
{
// 每次回发都更新时间,展示是服务器端渲染
lblTime.Text = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
}
}
protected void btnClick_Click(object sender, EventArgs e)
{
ClickCount++;
lblCount.Text = ClickCount.ToString();
}
}
}
3. 另一个常见实例:登录表单 + 验证
Login.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="WebFormsDemo.Login" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>用户登录</title>
<style>
.box { width: 300px; margin: 100px auto; font-family: Arial; }
.txt { width: 100%; padding: 8px; margin: 5px 0; }
.btn { padding: 10px 20px; }
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="box">
<h2>登录系统</h2>
<asp:Label ID="Label1" runat="server" Text="用户名:" AssociatedControlID="txtUser"></asp:Label>
<asp:TextBox ID="txtUser" runat="server" CssClass="txt"></asp:TextBox>
<asp:Label ID="Label2" runat="server" Text="密码:" AssociatedControlID="txtPass"></asp:Label>
<asp:TextBox ID="txtPass" runat="server" TextMode="Password" CssClass="txt"></asp:TextBox>
<br /><br />
<asp:Button ID="btnLogin" runat="server" Text="登录" OnClick="btnLogin_Click" CssClass="btn" />
<br /><br />
<asp:Label ID="lblMessage" runat="server" ForeColor="Red" Font-Bold="true"></asp:Label>
</div>
</form>
</body>
</html>
Login.aspx.cs
using System;
using System.Web.UI;
namespace WebFormsDemo
{
public partial class Login : Page
{
protected void btnLogin_Click(object sender, EventArgs e)
{
string user = txtUser.Text.Trim();
string pass = txtPass.Text;
if (user == "admin" && pass == "123456")
{
lblMessage.ForeColor = System.Drawing.Color.Green;
lblMessage.Text = "登录成功!欢迎 " + user;
// 可以在这里做 Session 或 FormsAuthentication
Session["User"] = user;
Response.Redirect("~/Default.aspx");
}
else
{
lblMessage.ForeColor = System.Drawing.Color.Red;
lblMessage.Text = "用户名或密码错误!";
}
}
}
}
4. 运行项目
按 F5 直接运行,默认会打开 Default.aspx,点击按钮可以看到计数器一直递增(即使刷新页面也不会丢失,因为用了 ViewState)。
5. Web Forms 核心概念快速回顾(对应上面代码)
| 概念 | 代码体现 | 说明 |
|---|---|---|
| .aspx 文件 | 前端标记 + 服务器控件 | 包含 runat=”server” 的控件 |
| CodeBehind | Default.aspx.cs | 页面逻辑代码(C#) |
| Page_Load | 页面每次请求(包括回发)都会执行 | !IsPostBack 判断是否首次加载 |
| ViewState | ViewState[“ClickCount”] | 自动在回发之间保持状态 |
| 事件驱动 | btnClick_Click | 按钮点击后触发服务器端事件 |
| PostBack | 表单提交到同一页面 | Web Forms 的核心机制 |
| Session | Session[“User”] = user; | 服务端会话状态 |
这个例子已经包含了 Web Forms 最核心的生命周期、状态管理、事件模型,可以直接拷贝到 Visual Studio 里运行学习。
如果你想要更高级的例子(GridView 分页编辑、MasterPage 母版页、UserControl 用户控件、异步回发 UpdatePanel 等),随时告诉我,我继续给你写!