逐步解說：建立簡單 Web 應用程式

發行項
08/21/2008

更新：2007 年 11 月

在本逐步節說中，您會建立一個簡單 Web 應用程式，做為逐步解說：記錄和執行 Web 測試之 Web 測試的基礎。

為了建立簡單 Web 測試，您應該使用可以任意變更的 Web 應用程式。

在這個逐步解說中，您將執行下列工作：

建立簡單 Web 應用程式。
手動測試 Web 應用程式。

必要條件

在本逐步解說中，您將會需要：

Microsoft Visual Studio 2005

建立 Web 應用程式

建立 Web 應用程式

在 Microsoft Visual Studio 2005 中的 [檔案] 功能表上，按一下 [新增] 然後按一下 [網站]。

[新網站] 對話方塊隨即出現。
在 [Visual Studio 安裝的範本] 下方，按一下 [ASP.NET 網站]。
在 [位置] 方塊中，選取 [檔案系統]，然後輸入您想要用來保存 Web 應用程式的資料夾名稱。請使用 ColorWebApp\ColorWebApp 做為資料夾名稱的結尾。例如，輸入資料夾名稱 C:\WebSites\ColorWebApp\ColorWebApp。

注意事項：

將名稱包含兩次，以便您將 Web 測試專案加入至第一個資料夾，而且可以和第二個資料夾中的 Web 應用程式區分。
在 [語言] 清單中，選擇您慣用的程式語言。

注意事項：

在此逐步解說中，您將會撰寫最小的程式檔。
按一下 [確定]。

將控制項加入至 Web 應用程式

將控制項加入至 Web 應用程式

在 [方案總管] 中，以滑鼠右鍵按一下 [Default.aspx]，然後選擇 [設計工具檢視]。

空白網頁隨即出現。
如果沒看到 [工具箱]，請按一下 [檢視] 然後按一下 [工具箱]。
從 [標準] 群組中，請將 RadioButtonList 拖曳到網頁上。

RadioButtonList 控制項便會加入至設計介面中。
在 [RadioButtonList 工作] 智慧標籤面版上，按一下 [編輯項目] 連結。

[ListItem 集合編輯器] 隨即出現。

注意事項：

也可以藉由在 [屬性] 視窗中編輯 [項目] 集合，以顯示 [ListItem 集合編輯器]。
按一下 [加入] 以加入新項目。
在 [ListItem 屬性] 下：
1. 將 [Text] 屬性變更為 [Red]。
2. 將 [Selected] 屬性設定為 [True]。
按一下 [加入] 以加入其他項目。
在 [ListItem 屬性] 下，將 [Text] 屬性變更為 [Blue]。
按一下 [確定]，關閉 [ListItem 集合編輯器]。
將 Button 拖曳至網頁上，並將 [Text] 屬性變更為 [送出]。
在 [檔案] 功能表上，按一下 [全部儲存]。

將網頁加入至 Web 應用程式

將網頁加入至 Web 應用程式

在 [網站] 功能表上，按一下 [加入新項目]。
在 [加入新項目] 對話方塊中，按一下 [Web Form] 範本，將它命名為 Red.aspx，然後按一下 [加入]。
在文件視窗的下方，按一下 [設計] 索引標籤切換至 [設計] 檢視。
將 Label 拖曳至網頁。將 [Text] 屬性設定為 [Red]、[ForeColor] 屬性設定為 [Red]。
在 [網站] 功能表上，按一下 [加入新項目]。
在 [加入新項目] 對話方塊中，按一下 [Web Form] 範本，將它命名為 Blue.aspx，然後按一下 [加入]。
在文件視窗的下方，按一下 [設計] 索引標籤切換至 [設計] 檢視。
將 Label 拖曳至網頁。將 [Text] 屬性設定為 [Blue]、[ForeColor] 屬性設定為 [Blue]。
在 [檔案] 功能表上，按一下 [全部儲存]。

將功能加入至 Web 應用程式

將功能加入至 Web 應用程式

在 [方案總管] 中，以滑鼠右鍵按一下 [Default.aspx]，然後按一下 [設計工具檢視]。
按兩下 [送出] Button。Visual Studio 會切換至網頁程式碼，並為 Button 控制項的 Click 事件建立 skeleton 事件處理常式。

將下列程式碼加入至事件處理常式：

if (this.RadioButtonList1.SelectedValue == "Blue")
{
    Response.Redirect("Blue.aspx");
}
else
{
    Response.Redirect("Red.aspx");
}

If RadioButtonList1.SelectedValue = "Blue" Then
    Response.Redirect("Blue.aspx")
Else
    Response.Redirect("Red.aspx")
End If

在 [檔案] 功能表上，按一下 [全部儲存]。

手動測試 Web 應用程式

手動測試 Web 應用程式

在 [方案總管] 中，以滑鼠右鍵按一下 [Default.aspx]，然後按一下 [設定為起始頁]。
按下 CTRL+F5，即可在瀏覽器中執行 Web 應用程式。您將會看見第一頁。
按一下 [Red]，然後按一下 [送出]。如果應用程式運作正確，您會前往另一網頁，其中 Label 寫著 Red。
返回第一頁。
按一下 [Blue]，然後按一下 [送出]。如果應用程式運作正確，您會前往另一網頁，其中 Label 寫著 Blue。

後續步驟

在此逐步解說中，您已建立了簡單 Web 應用程式並手動進行測試。現在您可以建立 Web 測試，讓您測試這個應用程式。如需詳細資訊，請參閱逐步解說：記錄和執行 Web 測試。

請參閱

工作

逐步解說：記錄和執行 Web 測試

其他資源

建立 Visual Web Developer 網站導覽