ASPNET動態(tài)網(wǎng)站設(shè)計與實現(xiàn)以一個真實運行的網(wǎng)站為案例-教學(xué)課件-丁桂芝-張臻-第7章

在線教務(wù)輔導(dǎo)網(wǎng)：教材其余課件及動畫素材請查閱在線教務(wù)輔導(dǎo)網(wǎng)QQ:349134187

或者直接輸入下面地址：在線教務(wù)輔導(dǎo)網(wǎng)：http://www.shangfuwang2第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁由于實際的“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站包含的網(wǎng)頁文件達1百多個，在一本書中不可能都介紹過來。因此，本書我們只挑選部分有代表性的網(wǎng)頁及相關(guān)文件進行介紹。在制作網(wǎng)頁之前，我們首先要創(chuàng)建一個ASP.NET網(wǎng)站，即“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站，其操作如下。

1．啟動“VisualStudio

2008”，在VisualStudio

2008集成開發(fā)環(huán)境中，選

擇【文件】→【新建】→【網(wǎng)站】命令，或者直接單

擊工具欄上的【新建網(wǎng)站】

按鈕

，在屏幕上會打開一個

“新建網(wǎng)站”對話框，如右

圖所示。2第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁3第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁2．在“VisualStudio已安裝的模板”中單擊“ASP.NET網(wǎng)站”，在“位置”下拉菜單中選擇“文件系統(tǒng)”，然后輸入要保存網(wǎng)站的文件夾名稱，也可以通過單擊【瀏覽】按鈕，打開“選擇位置”對話框，在該對話框左側(cè)的網(wǎng)站類型列表中默認選中“文件系統(tǒng)”，在右側(cè)文件系統(tǒng)樹形目錄中選擇一個文件夾（本例選擇“D:\HLFWebSite\Chapter7”，即選擇D:盤下HLFWebSite文件夾下的Chapter7文件夾作為“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站的根文件夾）。在“語言”下拉菜單中選擇“VisualC#”，所選的編程語言“VisualC#”將作為網(wǎng)站編程的默認語言。注意：創(chuàng)建網(wǎng)站時需要指定一個模板，每個模板創(chuàng)建包含不同文件和文件夾的應(yīng)用程序。另外，可以通過使用不同的編程語言創(chuàng)建頁和組件，在同一個Web應(yīng)用程序中可以使用多種語言。3．單擊【確定】按鈕，一個ASP.NET網(wǎng)站“科技服務(wù)咨詢管理系統(tǒng)”創(chuàng)建完成，保存位置為D:\HLFWebSite\Chapter7。3第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁4第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁當創(chuàng)建這個網(wǎng)站的時候，VisualStudio2008自動創(chuàng)建了一個App_Data文件夾，一個名為Default.aspx的ASP.NET頁（Web窗體頁），以及一個名為web.config的Web配置文件。這些文件夾和文件都將顯示在解決方案資源管理器中。自動創(chuàng)建的Default.aspx頁面將會打開，內(nèi)容顯示在文檔窗口內(nèi)。新頁創(chuàng)建后，默認以“源”視圖顯示該頁，在該視圖下您可以查看頁面的HTML元素。現(xiàn)在這個ASP.NET頁面只包含HTML代碼，尚未添加任何內(nèi)容。可以使用Default.aspx頁作為網(wǎng)站的首頁。單擊【解決方案資源管理器】中的Default.aspx上的加號圖標

，將會看到另一個嵌套的文件Default.aspx.cs，它就是Default.aspx的源代碼文件，也就是Default.aspx文件的后臺文件。至此，一個以D:\HLFWebSite\Chapter7為根文件夾的ASP.NET網(wǎng)站（即“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站）創(chuàng)建完成。接下來，我們介紹網(wǎng)站賴以生存的數(shù)據(jù)庫的創(chuàng)建，修改配置文件，向網(wǎng)站添加網(wǎng)頁等內(nèi)容。4第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁5第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.1創(chuàng)建網(wǎng)站所用數(shù)據(jù)庫創(chuàng)建“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站所用到的數(shù)據(jù)庫Mydata以及其中的所有數(shù)據(jù)庫表，可以按照本節(jié)的前兩個小節(jié)的介紹自行創(chuàng)建，如果時間不允許或覺得沒有必要則可以按照本節(jié)的7.1.3小節(jié)進行附加Mydata數(shù)據(jù)庫操作。

7.1.1創(chuàng)建數(shù)據(jù)庫⑴單擊“開始”→“程序”→“MicrosoftSQLServer2005”→“SQLServerManagementStudio”。⑵在“連接到服務(wù)器”對話框中，輸入服務(wù)器名稱、密碼（如只在當前計算機工作則只需輸入數(shù)據(jù)庫服務(wù)器密碼），驗證默認設(shè)置，然后單擊【連接】按鈕，啟動ManagementStudio。ManagementStudio是SQLServer2005中管理數(shù)據(jù)庫的場所。⑶在對象資源管理器中選擇【數(shù)據(jù)庫】節(jié)點。在【數(shù)據(jù)庫】節(jié)點上單擊右鍵，并在彈出的菜單中選擇【新建數(shù)據(jù)庫】。5第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁6第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.1.1創(chuàng)建數(shù)據(jù)庫⑷在打開的“新建數(shù)據(jù)庫”對話框中，輸入數(shù)據(jù)庫名稱Mydata和路徑D:\HLFWebSite\db，如下圖所示。⑸單擊【確定】按鈕即

可完成新建數(shù)據(jù)庫的操作。注意：此時雖然新建了

數(shù)據(jù)庫，但是數(shù)據(jù)庫中并沒

有任何用戶自定義的表和其

它信息，這些需要用戶自己

添加。具體添加方法請見下

一小節(jié)。6第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.1.2在數(shù)據(jù)庫中創(chuàng)建數(shù)據(jù)庫表根據(jù)需要，在“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站Mydata數(shù)據(jù)庫中，創(chuàng)建content、count、news、news_type、userinfo、vedio、xbcy和zscq等8張數(shù)據(jù)庫表，表的名稱由開發(fā)人員自行定義。

1創(chuàng)建content表⑴打開ManagementStudio，在對象資源管理器中的樹狀目錄窗口中展開Mydata數(shù)據(jù)庫。⑵右鍵單擊【表】節(jié)點，在彈出菜單中選擇“新建表”命令，打開表設(shè)計窗口。⑶在表設(shè)計窗口中按照如下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型titlenvarcharMAX是否內(nèi)容標題[content]nvarcharMAX是否內(nèi)容typenamenvarcharMAX是否內(nèi)容類別7第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁8第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁1創(chuàng)建content表⑷要建立上表所示的content表，只需要在表屬性中輸入對應(yīng)信息。要注意的是id列的設(shè)置，必須在表設(shè)計屬性窗口的下面窗口中設(shè)置有關(guān)標識方面的信息，具體設(shè)置如下圖所示。注意：對于id列，設(shè)置id為標識，表示id的值是content表中每一行數(shù)據(jù)的標識，也就是一個id惟一確定一行數(shù)據(jù)。設(shè)置標識種子為1，表示id列從1開始編號；設(shè)置標識增量為1，表示id列每行遞增為1。對id列做如上設(shè)置以后id列的值將由數(shù)據(jù)庫自動填充，任何人為的填充和修改都不允許。⑸單擊工具欄上的【保存表】按鈕

，在“選擇名稱”對話框中輸入表名稱“content”，然后單擊【確定】按鈕，保存表。8第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁9第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁1創(chuàng)建content表至此，已經(jīng)成功向數(shù)據(jù)庫Mydata中添加了content表。剛創(chuàng)建好的content表中不包括任何記錄，下一步我們向數(shù)據(jù)表中添加一些初始記錄。⑹向數(shù)據(jù)表content中添加數(shù)據(jù)的操作如下。①在ManagementStudio的樹狀目錄中選中剛創(chuàng)建好的表content。②右鍵單擊content表，在彈出菜單中選擇【打開表】命令，打開數(shù)據(jù)錄入窗口。③在數(shù)據(jù)錄入窗口輸入新的表記錄。注意：以上操作也適合修改和刪除表中的數(shù)據(jù)操作。

說明：在下面創(chuàng)建的數(shù)據(jù)表中，可按照隨書所贈光盤中Mydata數(shù)據(jù)庫中各數(shù)據(jù)表中數(shù)據(jù)向自行創(chuàng)建的數(shù)據(jù)表中添加數(shù)據(jù)。9第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁10第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁2創(chuàng)建count表⑴打開ManagementStudio，在對象資源管理器中的樹狀目錄窗口中展開Mydata數(shù)據(jù)庫。⑵右鍵單擊【表】節(jié)點，在彈出菜單中選擇“新建表”命令，打開表設(shè)計窗口。⑶在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。列名數(shù)據(jù)類型長度允許空是否標識說明counterint4是否訪問總次數(shù)todayint4是否今天訪問次數(shù)daytimesint4是否統(tǒng)計天數(shù)lastdatedatetime8是否上次統(tǒng)計日期10第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁11第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁3創(chuàng)建news表同創(chuàng)建content、count數(shù)據(jù)庫表的操作一樣，在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵titlenvarchar50是否標題[content]nvarcharMAX否否內(nèi)容authornchar10是否發(fā)布作者countint4是否該條信息訪問次數(shù)datenvarchar50是否發(fā)布日期srnvarchar50是否信息來源newstypenvarchar50是否信息類別11第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁12第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁4創(chuàng)建news_type表在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。

5創(chuàng)建userinfo表

6創(chuàng)建vedio表在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。列名數(shù)據(jù)類型長度允許空是否標識說明newstypenvarchar50是否類別列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵useridnvarchar50否否后臺登陸用戶名userpwdnvarchar50否否密碼列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵vediotitlenvarchar50是否視頻標題vedioaddrnvarcharMAX是否視頻上傳地址countint4否否訪問次數(shù)12第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁13第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7創(chuàng)建xbcy表在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。

8創(chuàng)建zscq表在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。

列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵typenvarchar50是否校辦產(chǎn)業(yè)信息類別[content]nvarcharMAX是否校辦產(chǎn)業(yè)信息列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵typenvarcharMAX是否知識產(chǎn)權(quán)信息類別[content]nvarcharMAX是否知識產(chǎn)權(quán)信息13第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁14第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.1.3附加數(shù)據(jù)庫附加數(shù)據(jù)庫的操作如下。⑴啟動SQLServerManagementStudio。⑵在對象資源管理器中選擇【數(shù)據(jù)庫】節(jié)點并單擊右鍵，然后在彈出的菜單中選擇【附加】。⑶在打開的“附加數(shù)據(jù)庫”對話框中，單擊【添加】按鈕。⑷在打開的“定位數(shù)據(jù)庫文件”對話框中，所選路徑為D:\HLFWebSite\db，文件名為“Mydata.mdf”。然后單擊【確定】按鈕，執(zhí)行添加操作、關(guān)閉“定位數(shù)據(jù)庫文件”對話框并返回“附加數(shù)據(jù)庫”對話框。⑸單擊【確定】按鈕，完成Mydata數(shù)據(jù)庫的附加操作。

14第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁15第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.2配置Web.config文件在【解決方案資源管理器】中，雙擊Web.config文件，默認情況下將在XML編輯器中打開Web.config文件，可以看到Web.config文件的默認配置設(shè)置。我們要做的是對需要配置的配置節(jié)設(shè)置進行適當?shù)匦薷摹?/p>

Web.config文件的完整代碼請見書。其中，粗體部分為添加或者修改配置節(jié)后的代碼，其注釋請見2.5.2小節(jié)。其它代碼均由VisualStudio2008自動生成。15第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁16第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3網(wǎng)站首頁的制作首頁通常是網(wǎng)站中最為重要的網(wǎng)頁，它不僅包含的內(nèi)容最為豐富，而且功能也是最多的。

比如，它通常要有網(wǎng)

頁標題、網(wǎng)頁頁眉、

網(wǎng)頁導(dǎo)航欄、網(wǎng)頁的

主體內(nèi)容、瀏覽量統(tǒng)

計以及網(wǎng)頁頁腳等?！翱萍挤?wù)咨詢管理系

統(tǒng)”網(wǎng)站首頁的文件結(jié)

構(gòu)如右圖所示。16第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁17第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.1創(chuàng)建“網(wǎng)頁頁眉”文件編輯完成后的banner.htm代碼如下：<tablewidth="1000"border="0"cellspacing="0"cellpadding="0"><tr><tdheight="194"background="images/top.jpg"><embedsrc="top.swf"width="1000"height="194"wmode="transparent"type="application/x-shockwave-flash"></embed></td></tr></table>17第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁18第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.2創(chuàng)建“導(dǎo)航欄”文件創(chuàng)建navigation.aspx文件可分三個步驟進行。第一步，先創(chuàng)建一個菜單文件menu.htm；第二步，創(chuàng)建一個topscript.js文件，用于規(guī)范菜單文件menu.htm樣式，同時topscript.js文件還可以用于規(guī)范首頁及其它網(wǎng)頁的樣式；第三步，將menu.htm和topscript.js文件組合在一起形成導(dǎo)航欄文件navigation.aspx。

1創(chuàng)建“菜單”文件（menu.htm）創(chuàng)建方法及編輯完成后的menu.htm代碼請見書。

2創(chuàng)建topscript.js文件為能使menu.htm文件正常顯示，需在首頁及相關(guān)文件中以包含文件的形式引用一個叫做“topscript.js”的文件。使用該文件規(guī)范menu.htm文件樣式，可正常顯示導(dǎo)航欄。創(chuàng)建topscript.js文件的操作過程及代碼請見書。18第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁19第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁3創(chuàng)建navigation.aspx文件將menu.htm和topscript.js文件組合在一起便可形成導(dǎo)航欄文件navigation.aspx。navigation.aspx文件代碼請見書。

navigation.aspx文件在瀏覽器中的顯示效果如下圖所示。該導(dǎo)航欄共包含13個導(dǎo)航菜單。當鼠標指針指向?qū)Ш綑谏系哪硞€“導(dǎo)航菜單”文字鏈接時，鼠標指針變成了手指狀，同時該導(dǎo)航菜單所包括的菜單項就會顯示出來，將鼠標指針移動到所要瀏覽的菜單項單擊，即可打開相應(yīng)的網(wǎng)頁（目前我們還沒有制作相應(yīng)的網(wǎng)頁）。19第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁20第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.3創(chuàng)建“頁尾”文件

bottom.html文件以包含文件（<!--#includefile=“bottom.html”-->）的形式出現(xiàn)在首頁及相關(guān)文件中。創(chuàng)建bottom.html文件的操作及編輯完成后的bottom.html代碼請見書。

bottom.html在瀏覽器中的顯示效果如下圖所示。20第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁21第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.4創(chuàng)建“主體窗口左側(cè)”文件該文件以包含文件（<!--#includefile="left.aspx"-->）的形式出現(xiàn)在首頁文件中。創(chuàng)建left.aspx文件可分三個步驟進行。第一步，先創(chuàng)建一個名為gonggao.aspx的文件；第二步，創(chuàng)建一個名為link.html的文件；第三步，創(chuàng)建“主體窗口左側(cè)”文件（left.aspx），將gonggao.aspx和link.html文件以包含文件的形式出現(xiàn)在left.aspx

文件中。

1創(chuàng)建gonggao.aspx文件

2創(chuàng)建link.html文件

3創(chuàng)建left.aspx文件創(chuàng)建left.aspx文件的操作過程及步驟請見書。

left.aspx文件在瀏覽器中的顯示效果如右圖所示。21第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁22第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.5創(chuàng)建“主體窗口右側(cè)”文件該文件以包含文件（<!--#include

file="right.html"-->）的形式出現(xiàn)在首

頁文件中。創(chuàng)建right.aspx文件的操作及編輯

完成后的right.aspx代碼請見書。

right.aspx在瀏覽器中的顯示效果如右

圖所示。22第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁23第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.6創(chuàng)建“主體窗口中間部分”文件“主體窗口中間部分”文件的完整代碼請見書。由“主體窗口中間部分”文件代碼可以看出，整個文件包含在一個單元格<td>和</td>中，在這個單元格中包含一個表格<table></table>，這是一個三行一列的表格。下面我們逐行介紹。

1創(chuàng)建第一行內(nèi)容第一行代碼比較多，也比較復(fù)雜，請讀者仔細閱讀。

2創(chuàng)建第二行內(nèi)容第二行的代碼非常簡單，代碼請見書。

3創(chuàng)建第三行內(nèi)容第三行的單元格中，用于視頻顯示。編輯完成后“第三行”的完整代碼請見書。這里的視頻顯示是從從數(shù)據(jù)庫中讀取上傳的視頻的路徑在線播放。23第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁24第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.7常用“新聞瀏覽”文件創(chuàng)建“新聞瀏覽”幾乎出現(xiàn)在每個網(wǎng)站首頁中，因此，這里專門就“新聞瀏覽”文件的創(chuàng)建進行制作介紹。當打開“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站首頁時，會看到首頁中部窗口部分有許多新聞標題，用鼠標移動到某新聞標題時，鼠標指針會變成手指狀，單擊該標題會鏈接打開顯示該標題下詳細內(nèi)容的頁面，這個頁面文件就是“新聞瀏覽”文件（newsbrowser.aspx），也就是說，通過newsbrowser.aspx打開需要瀏覽的新聞內(nèi)容。下面介紹一下“新聞瀏覽”文件（newsbrowser.aspx）的創(chuàng)建過程?！靶侣劄g覽”文件newsbrowser.aspx的文件結(jié)構(gòu)如下頁圖所示。24第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁25第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.7常用“新聞瀏覽”文件創(chuàng)建“新聞瀏覽”文件newsbrowser.aspx的文件結(jié)構(gòu)圖。25第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁26第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.7常用“新聞瀏覽”文件創(chuàng)建“新聞瀏覽”文件的結(jié)構(gòu)和網(wǎng)站首頁的文件結(jié)構(gòu)比較，會發(fā)現(xiàn)兩者的頁眉、導(dǎo)航欄、主體窗口左側(cè)文件及頁腳部分完全相同，不同的是網(wǎng)頁的中部窗口的右側(cè)部分?！靶侣劄g覽”文件的中部窗口部分是左右結(jié)構(gòu)，主體窗口左側(cè)left.html文件以包含文件的形式出現(xiàn)在newsbrowser.aspx文件中，而且與首頁主體窗口左側(cè)left.html文件完全相同。而主體窗口右側(cè)則用來顯示頁面的主體部分。創(chuàng)建“新聞瀏覽”文件如同創(chuàng)建首頁一樣，也需分幾個步驟來進行。開始的步驟都是一樣的，操作如下：1.在【解決方案資源管理器】中，右鍵單擊D:\HLFWebSite\Chapter7\，在彈出菜單中選擇“添加新項”命令，打開的“添加新項”對話框。在“VisualStudio已安裝的模板”中單擊“Web窗體”，在“名稱”框中將文件名修改為newsbrowser.aspx，在“語言”下拉菜單中選擇VisualC#。26第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁27第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.7常用“新聞瀏覽”文件創(chuàng)建

2.單擊【添加】按鈕，newsbrowser.aspx便添加到D:\HLFWebSite\Chapter7目錄下，并且在編輯窗口自動打開newsbrowser.aspx。接下來，創(chuàng)建newsbrowser.aspx文件可分兩個步驟進行。第一步，創(chuàng)建“新聞瀏覽”文件主體窗口右側(cè)部分；第二步，給出newsbrowser.aspx文件完整代碼、后臺文件及代碼解釋。1創(chuàng)建“新聞瀏覽”文件主體窗口右側(cè)部分創(chuàng)建“新聞瀏覽”文件實際上主要是創(chuàng)建其主體窗口右側(cè)（主體）部分。因此，介紹創(chuàng)建newsbrowser.aspx文件實際上主要是介紹主體窗口右側(cè)部分，其代碼請見書。主體窗口右側(cè)部分就是上圖中的“主體部分”的內(nèi)容。整個部分是在<table>和</table>標記中。這是一個五行三列的表格，逐行介紹請見書。27第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁28第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁2“新聞瀏覽”文件newsbrowser.aspx完整代碼及代碼解釋編輯完成后的“新聞瀏覽”文件newsbrowser.aspx完整代碼請見書。“新聞瀏覽”文件newsbrowser.aspx的后臺文件newsbrowser.aspx.cs代碼及解釋請見書。

7.3.8首頁的完整代碼及代碼解釋“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站首頁（Default.aspx）的完整代碼請見書。首頁Default.aspx文件的后臺文件（Default.aspx.cs）代碼及解釋請見書。在首頁頁面中，單擊任何一新聞標題，都會通過newsbrowser.aspx打開需要瀏覽的新聞內(nèi)容。單擊任何一視頻標題，都會通過VedioPlay.aspx打開“科技前沿-視頻播放”頁面。28第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁29第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.4導(dǎo)航菜單中部分菜單項網(wǎng)頁的制作編輯完成該實例中的導(dǎo)航菜單共包含13項，即首頁、組織機構(gòu)、檢索查新、科研立項、知識產(chǎn)權(quán)、技術(shù)服務(wù)、論文著作、學(xué)生科技、校辦產(chǎn)業(yè)、成果展示、政策查詢、管理系統(tǒng)和下載專區(qū)。這里選擇表現(xiàn)形式具有代表性的“檢索查新”、“技術(shù)服務(wù)”和“校辦產(chǎn)業(yè)”菜單項網(wǎng)頁進行制作。

7.4.1“檢索查新”菜單項網(wǎng)頁的制作“檢索查新”導(dǎo)航菜單包括“檢索課堂”和“科技查新”兩個菜單項。當鼠標指針指向?qū)Ш綑谏系摹皺z索查新”文字鏈接時，鼠標指針變成了手指狀，同時“檢索查新”所包括的菜單項將會顯示出來，將鼠標指針移動到所要瀏覽的菜單項單擊，即可打開相應(yīng)的網(wǎng)頁。下面我們就分別介紹jscx.aspx和jscxbrowser.aspx這兩個文件的制作過程。29第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁30第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁1創(chuàng)建“檢索課堂”文件（jscx.aspx）“檢索課堂”文件的結(jié)構(gòu)如下圖所示。30第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁31第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁1創(chuàng)建“檢索課堂”文件（jscx.aspx）“檢索課堂”文件的結(jié)構(gòu)和網(wǎng)站首頁的文件結(jié)構(gòu)比較，會發(fā)現(xiàn)兩者的頁眉、導(dǎo)航欄及頁腳部分完全相同，不同的是網(wǎng)頁的中部窗口部分。“檢索課堂”文件的中部窗口部分是左右結(jié)構(gòu)，主體窗口左側(cè)jscxleft.html文件以包含文件的形式出現(xiàn)在jscx.aspx文件中；而主體窗口右側(cè)則用來顯示頁面的主體部分。創(chuàng)建jscx.aspx文件可分三個步驟進行。第一步，先創(chuàng)建一個“檢索課堂左側(cè)”文件jscxleft.html；第二步，創(chuàng)建“檢索課堂”文件主體窗口右側(cè)部分；第三步，給出jscx.aspx文件完整代碼、后臺文件及代碼解釋。詳細創(chuàng)建過程及完整代碼請見書。31第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁32第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁2創(chuàng)建“科技查新”文件（jscxbrowser.aspx）創(chuàng)建jscxbrowser.aspx文件可分二個步驟進行。第一步，先創(chuàng)建“科技查新”文件主體窗口右側(cè)部分；第二步，給出jscxbrowser.aspx文件完整代碼、后臺文件及代碼解釋。“科技查新”文件的結(jié)構(gòu)與“檢索課堂”文件的結(jié)構(gòu)完全一樣。唯一不同的是主體窗口右側(cè)（主體）部分。因此，介紹創(chuàng)建jscxbrowser.aspx文件實際上主要是介紹主體窗口右側(cè)部分，詳細創(chuàng)建過程及完整代碼請見書。

7.4.2“技術(shù)服務(wù)”菜單項網(wǎng)頁的制作技術(shù)服務(wù)導(dǎo)航菜單包括學(xué)校需求、社會需求、合作聯(lián)盟、成果推廣等四個菜單項。本節(jié)只介紹“技術(shù)服務(wù)——學(xué)校需求”和“技術(shù)服務(wù)——社會需求”菜單項。32第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁33第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.4.2“技術(shù)服務(wù)”菜單項網(wǎng)頁的制作“技術(shù)服務(wù)”文件的結(jié)構(gòu)如下圖所示。33第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁34第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.4.2“技術(shù)服務(wù)”菜單項網(wǎng)頁的制作“技術(shù)服務(wù)”文件的結(jié)構(gòu)和網(wǎng)站首頁的文件結(jié)構(gòu)比較，會發(fā)現(xiàn)兩者的頁眉、導(dǎo)航欄及頁腳部分完全相同，不同的是網(wǎng)頁的中部窗口部分?！凹夹g(shù)服務(wù)”文件的中部窗口部分是左右結(jié)構(gòu)，主體窗口左側(cè)jsfwleft.html文件以包含文件的形式出現(xiàn)在jsfw.aspx文件中；而主體窗口右側(cè)則用來顯示頁面的主體部分。創(chuàng)建jsfw.aspx文件可分三個步驟進行。第一步，先創(chuàng)建一個“技術(shù)服務(wù)左側(cè)”文件jsfwleft.html；第二步，創(chuàng)建“技術(shù)服務(wù)”文件主體窗口右側(cè)部分；第三步，給出jsfw.aspx文件完整代碼、后臺文件及代碼解釋。

1創(chuàng)建“技術(shù)服務(wù)左側(cè)”文件（jsfwleft.html）2創(chuàng)建“技術(shù)服務(wù)”文件主體窗口右側(cè)部分3“技術(shù)服務(wù)”文件jsfw.aspx完整代碼及代碼解釋詳細創(chuàng)建過程及完整代碼請見書。34第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁35第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.4.3“校辦產(chǎn)業(yè)”菜單項網(wǎng)頁的制作校辦產(chǎn)業(yè)導(dǎo)航菜單包括匯通儀器設(shè)備公司和機械工程實訓(xùn)中心兩個菜單項。單擊導(dǎo)航欄中“校辦產(chǎn)業(yè)”→“匯通儀器設(shè)備公司”，將會導(dǎo)航到

xbcy.aspx?id=2頁

面；單擊“校辦產(chǎn)

業(yè)”→“機械工程

實訓(xùn)中心”，將會

導(dǎo)航到

xbcy.aspx?id=6頁

面。下面我們介紹

xbcy.aspx文件的

制作過程?！靶＾k

產(chǎn)業(yè)”文件的結(jié)構(gòu)

如右圖所示。35第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁36第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.4.3“校辦產(chǎn)業(yè)”菜單項網(wǎng)頁的制作“校辦產(chǎn)業(yè)”文件的結(jié)構(gòu)和網(wǎng)站首頁的文件結(jié)構(gòu)比較，會發(fā)現(xiàn)兩者的頁眉、導(dǎo)航欄及頁腳部分完全相同，不同的是網(wǎng)頁的中部窗口部分?！靶＾k產(chǎn)業(yè)”文件的中部窗口部分是左右結(jié)構(gòu)，主體窗口左側(cè)xbcyleft.html文件以包含文件的形式出現(xiàn)在xbcy.aspx文件中；而主體窗口右側(cè)則用來顯示頁面的主體部分。創(chuàng)建xbcy.aspx文件可分三個步驟進行。第一步，先創(chuàng)建一個“校辦產(chǎn)業(yè)左側(cè)”文件xbcyleft.html；第二步，創(chuàng)建“校辦產(chǎn)業(yè)”文件主體窗口右側(cè)部分；第三步，給出xbcy.aspx文件完整代碼、后臺文件及代碼解釋。

1創(chuàng)建“校辦產(chǎn)業(yè)左側(cè)”文件（xbcyleft.html）

2創(chuàng)建“校辦產(chǎn)業(yè)”文件主體窗口右側(cè)部分

3“校辦產(chǎn)業(yè)”文件中xbcy.aspx完整代碼及代碼解釋詳細創(chuàng)建過程及完整代碼請見書。36第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁37第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.5本章小結(jié)本章首先介紹了創(chuàng)建“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站所用到的數(shù)據(jù)庫，數(shù)據(jù)庫中的所有數(shù)據(jù)庫表，以及附加數(shù)據(jù)庫的操作。介紹了網(wǎng)站的Web.config文件的配置。詳細介紹了網(wǎng)站首頁的制作過程，并給出了首頁的完整代碼及代碼解釋。詳細介紹了“檢索查新”、“技術(shù)服務(wù)”和“校辦產(chǎn)業(yè)”導(dǎo)航菜單中各菜單項網(wǎng)頁的制作過程。通過本章學(xué)習(xí)，希望讀者對文件的結(jié)構(gòu)，所涉及到的Table、Div、Image、Select、Label、Map、DataList等控件熟悉掌握并能加以運用，熟練掌握編輯DataList控件模板內(nèi)容的方法、超鏈接的用法，以及包含文件的用法。本章的所有源代碼均可以從網(wǎng)站上下載的源文件中HLFWebSite\Chapter7目錄下找到。37第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁在線教務(wù)輔導(dǎo)網(wǎng)：教材其余課件及動畫素材請查閱在線教務(wù)輔導(dǎo)網(wǎng)QQ:349134187

或者直接輸入下面地址：在線教務(wù)輔導(dǎo)網(wǎng)：http://www.shangfuwang39第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁由于實際的“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站包含的網(wǎng)頁文件達1百多個，在一本書中不可能都介紹過來。因此，本書我們只挑選部分有代表性的網(wǎng)頁及相關(guān)文件進行介紹。在制作網(wǎng)頁之前，我們首先要創(chuàng)建一個ASP.NET網(wǎng)站，即“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站，其操作如下。

1．啟動“VisualStudio

2008”，在VisualStudio

2008集成開發(fā)環(huán)境中，選

擇【文件】→【新建】→【網(wǎng)站】命令，或者直接單

擊工具欄上的【新建網(wǎng)站】

按鈕

，在屏幕上會打開一個

“新建網(wǎng)站”對話框，如右

圖所示。2第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁40第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁2．在“VisualStudio已安裝的模板”中單擊“ASP.NET網(wǎng)站”，在“位置”下拉菜單中選擇“文件系統(tǒng)”，然后輸入要保存網(wǎng)站的文件夾名稱，也可以通過單擊【瀏覽】按鈕，打開“選擇位置”對話框，在該對話框左側(cè)的網(wǎng)站類型列表中默認選中“文件系統(tǒng)”，在右側(cè)文件系統(tǒng)樹形目錄中選擇一個文件夾（本例選擇“D:\HLFWebSite\Chapter7”，即選擇D:盤下HLFWebSite文件夾下的Chapter7文件夾作為“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站的根文件夾）。在“語言”下拉菜單中選擇“VisualC#”，所選的編程語言“VisualC#”將作為網(wǎng)站編程的默認語言。注意：創(chuàng)建網(wǎng)站時需要指定一個模板，每個模板創(chuàng)建包含不同文件和文件夾的應(yīng)用程序。另外，可以通過使用不同的編程語言創(chuàng)建頁和組件，在同一個Web應(yīng)用程序中可以使用多種語言。3．單擊【確定】按鈕，一個ASP.NET網(wǎng)站“科技服務(wù)咨詢管理系統(tǒng)”創(chuàng)建完成，保存位置為D:\HLFWebSite\Chapter7。3第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁41第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁當創(chuàng)建這個網(wǎng)站的時候，VisualStudio2008自動創(chuàng)建了一個App_Data文件夾，一個名為Default.aspx的ASP.NET頁（Web窗體頁），以及一個名為web.config的Web配置文件。這些文件夾和文件都將顯示在解決方案資源管理器中。自動創(chuàng)建的Default.aspx頁面將會打開，內(nèi)容顯示在文檔窗口內(nèi)。新頁創(chuàng)建后，默認以“源”視圖顯示該頁，在該視圖下您可以查看頁面的HTML元素。現(xiàn)在這個ASP.NET頁面只包含HTML代碼，尚未添加任何內(nèi)容。可以使用Default.aspx頁作為網(wǎng)站的首頁。單擊【解決方案資源管理器】中的Default.aspx上的加號圖標

，將會看到另一個嵌套的文件Default.aspx.cs，它就是Default.aspx的源代碼文件，也就是Default.aspx文件的后臺文件。至此，一個以D:\HLFWebSite\Chapter7為根文件夾的ASP.NET網(wǎng)站（即“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站）創(chuàng)建完成。接下來，我們介紹網(wǎng)站賴以生存的數(shù)據(jù)庫的創(chuàng)建，修改配置文件，向網(wǎng)站添加網(wǎng)頁等內(nèi)容。4第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁42第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.1創(chuàng)建網(wǎng)站所用數(shù)據(jù)庫創(chuàng)建“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站所用到的數(shù)據(jù)庫Mydata以及其中的所有數(shù)據(jù)庫表，可以按照本節(jié)的前兩個小節(jié)的介紹自行創(chuàng)建，如果時間不允許或覺得沒有必要則可以按照本節(jié)的7.1.3小節(jié)進行附加Mydata數(shù)據(jù)庫操作。

7.1.1創(chuàng)建數(shù)據(jù)庫⑴單擊“開始”→“程序”→“MicrosoftSQLServer2005”→“SQLServerManagementStudio”。⑵在“連接到服務(wù)器”對話框中，輸入服務(wù)器名稱、密碼（如只在當前計算機工作則只需輸入數(shù)據(jù)庫服務(wù)器密碼），驗證默認設(shè)置，然后單擊【連接】按鈕，啟動ManagementStudio。ManagementStudio是SQLServer2005中管理數(shù)據(jù)庫的場所。⑶在對象資源管理器中選擇【數(shù)據(jù)庫】節(jié)點。在【數(shù)據(jù)庫】節(jié)點上單擊右鍵，并在彈出的菜單中選擇【新建數(shù)據(jù)庫】。5第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁43第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.1.1創(chuàng)建數(shù)據(jù)庫⑷在打開的“新建數(shù)據(jù)庫”對話框中，輸入數(shù)據(jù)庫名稱Mydata和路徑D:\HLFWebSite\db，如下圖所示。⑸單擊【確定】按鈕即

可完成新建數(shù)據(jù)庫的操作。注意：此時雖然新建了

數(shù)據(jù)庫，但是數(shù)據(jù)庫中并沒

有任何用戶自定義的表和其

它信息，這些需要用戶自己

添加。具體添加方法請見下

一小節(jié)。6第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁44第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.1.2在數(shù)據(jù)庫中創(chuàng)建數(shù)據(jù)庫表根據(jù)需要，在“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站Mydata數(shù)據(jù)庫中，創(chuàng)建content、count、news、news_type、userinfo、vedio、xbcy和zscq等8張數(shù)據(jù)庫表，表的名稱由開發(fā)人員自行定義。

1創(chuàng)建content表⑴打開ManagementStudio，在對象資源管理器中的樹狀目錄窗口中展開Mydata數(shù)據(jù)庫。⑵右鍵單擊【表】節(jié)點，在彈出菜單中選擇“新建表”命令，打開表設(shè)計窗口。⑶在表設(shè)計窗口中按照如下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型titlenvarcharMAX是否內(nèi)容標題[content]nvarcharMAX是否內(nèi)容typenamenvarcharMAX是否內(nèi)容類別7第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁45第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁1創(chuàng)建content表⑷要建立上表所示的content表，只需要在表屬性中輸入對應(yīng)信息。要注意的是id列的設(shè)置，必須在表設(shè)計屬性窗口的下面窗口中設(shè)置有關(guān)標識方面的信息，具體設(shè)置如下圖所示。注意：對于id列，設(shè)置id為標識，表示id的值是content表中每一行數(shù)據(jù)的標識，也就是一個id惟一確定一行數(shù)據(jù)。設(shè)置標識種子為1，表示id列從1開始編號；設(shè)置標識增量為1，表示id列每行遞增為1。對id列做如上設(shè)置以后id列的值將由數(shù)據(jù)庫自動填充，任何人為的填充和修改都不允許。⑸單擊工具欄上的【保存表】按鈕

，在“選擇名稱”對話框中輸入表名稱“content”，然后單擊【確定】按鈕，保存表。8第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁46第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁1創(chuàng)建content表至此，已經(jīng)成功向數(shù)據(jù)庫Mydata中添加了content表。剛創(chuàng)建好的content表中不包括任何記錄，下一步我們向數(shù)據(jù)表中添加一些初始記錄。⑹向數(shù)據(jù)表content中添加數(shù)據(jù)的操作如下。①在ManagementStudio的樹狀目錄中選中剛創(chuàng)建好的表content。②右鍵單擊content表，在彈出菜單中選擇【打開表】命令，打開數(shù)據(jù)錄入窗口。③在數(shù)據(jù)錄入窗口輸入新的表記錄。注意：以上操作也適合修改和刪除表中的數(shù)據(jù)操作。

說明：在下面創(chuàng)建的數(shù)據(jù)表中，可按照隨書所贈光盤中Mydata數(shù)據(jù)庫中各數(shù)據(jù)表中數(shù)據(jù)向自行創(chuàng)建的數(shù)據(jù)表中添加數(shù)據(jù)。9第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁47第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁2創(chuàng)建count表⑴打開ManagementStudio，在對象資源管理器中的樹狀目錄窗口中展開Mydata數(shù)據(jù)庫。⑵右鍵單擊【表】節(jié)點，在彈出菜單中選擇“新建表”命令，打開表設(shè)計窗口。⑶在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。列名數(shù)據(jù)類型長度允許空是否標識說明counterint4是否訪問總次數(shù)todayint4是否今天訪問次數(shù)daytimesint4是否統(tǒng)計天數(shù)lastdatedatetime8是否上次統(tǒng)計日期10第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁48第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁3創(chuàng)建news表同創(chuàng)建content、count數(shù)據(jù)庫表的操作一樣，在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵titlenvarchar50是否標題[content]nvarcharMAX否否內(nèi)容authornchar10是否發(fā)布作者countint4是否該條信息訪問次數(shù)datenvarchar50是否發(fā)布日期srnvarchar50是否信息來源newstypenvarchar50是否信息類別11第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁49第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁4創(chuàng)建news_type表在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。

5創(chuàng)建userinfo表

6創(chuàng)建vedio表在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。列名數(shù)據(jù)類型長度允許空是否標識說明newstypenvarchar50是否類別列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵useridnvarchar50否否后臺登陸用戶名userpwdnvarchar50否否密碼列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵vediotitlenvarchar50是否視頻標題vedioaddrnvarcharMAX是否視頻上傳地址countint4否否訪問次數(shù)12第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁50第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7創(chuàng)建xbcy表在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。

8創(chuàng)建zscq表在表設(shè)計窗口中按照下表所示內(nèi)容定義數(shù)據(jù)表列名及屬性。

列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵typenvarchar50是否校辦產(chǎn)業(yè)信息類別[content]nvarcharMAX是否校辦產(chǎn)業(yè)信息列名數(shù)據(jù)類型長度允許空是否標識說明idint4否是自動遞增型，主鍵typenvarcharMAX是否知識產(chǎn)權(quán)信息類別[content]nvarcharMAX是否知識產(chǎn)權(quán)信息13第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁51第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.1.3附加數(shù)據(jù)庫附加數(shù)據(jù)庫的操作如下。⑴啟動SQLServerManagementStudio。⑵在對象資源管理器中選擇【數(shù)據(jù)庫】節(jié)點并單擊右鍵，然后在彈出的菜單中選擇【附加】。⑶在打開的“附加數(shù)據(jù)庫”對話框中，單擊【添加】按鈕。⑷在打開的“定位數(shù)據(jù)庫文件”對話框中，所選路徑為D:\HLFWebSite\db，文件名為“Mydata.mdf”。然后單擊【確定】按鈕，執(zhí)行添加操作、關(guān)閉“定位數(shù)據(jù)庫文件”對話框并返回“附加數(shù)據(jù)庫”對話框。⑸單擊【確定】按鈕，完成Mydata數(shù)據(jù)庫的附加操作。

14第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁52第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.2配置Web.config文件在【解決方案資源管理器】中，雙擊Web.config文件，默認情況下將在XML編輯器中打開Web.config文件，可以看到Web.config文件的默認配置設(shè)置。我們要做的是對需要配置的配置節(jié)設(shè)置進行適當?shù)匦薷摹?/p>

Web.config文件的完整代碼請見書。其中，粗體部分為添加或者修改配置節(jié)后的代碼，其注釋請見2.5.2小節(jié)。其它代碼均由VisualStudio2008自動生成。15第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁53第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3網(wǎng)站首頁的制作首頁通常是網(wǎng)站中最為重要的網(wǎng)頁，它不僅包含的內(nèi)容最為豐富，而且功能也是最多的。

比如，它通常要有網(wǎng)

頁標題、網(wǎng)頁頁眉、

網(wǎng)頁導(dǎo)航欄、網(wǎng)頁的

主體內(nèi)容、瀏覽量統(tǒng)

計以及網(wǎng)頁頁腳等。“科技服務(wù)咨詢管理系

統(tǒng)”網(wǎng)站首頁的文件結(jié)

構(gòu)如右圖所示。16第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁54第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.1創(chuàng)建“網(wǎng)頁頁眉”文件編輯完成后的banner.htm代碼如下：<tablewidth="1000"border="0"cellspacing="0"cellpadding="0"><tr><tdheight="194"background="images/top.jpg"><embedsrc="top.swf"width="1000"height="194"wmode="transparent"type="application/x-shockwave-flash"></embed></td></tr></table>17第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁55第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.2創(chuàng)建“導(dǎo)航欄”文件創(chuàng)建navigation.aspx文件可分三個步驟進行。第一步，先創(chuàng)建一個菜單文件menu.htm；第二步，創(chuàng)建一個topscript.js文件，用于規(guī)范菜單文件menu.htm樣式，同時topscript.js文件還可以用于規(guī)范首頁及其它網(wǎng)頁的樣式；第三步，將menu.htm和topscript.js文件組合在一起形成導(dǎo)航欄文件navigation.aspx。

1創(chuàng)建“菜單”文件（menu.htm）創(chuàng)建方法及編輯完成后的menu.htm代碼請見書。

2創(chuàng)建topscript.js文件為能使menu.htm文件正常顯示，需在首頁及相關(guān)文件中以包含文件的形式引用一個叫做“topscript.js”的文件。使用該文件規(guī)范menu.htm文件樣式，可正常顯示導(dǎo)航欄。創(chuàng)建topscript.js文件的操作過程及代碼請見書。18第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁56第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁3創(chuàng)建navigation.aspx文件將menu.htm和topscript.js文件組合在一起便可形成導(dǎo)航欄文件navigation.aspx。navigation.aspx文件代碼請見書。

navigation.aspx文件在瀏覽器中的顯示效果如下圖所示。該導(dǎo)航欄共包含13個導(dǎo)航菜單。當鼠標指針指向?qū)Ш綑谏系哪硞€“導(dǎo)航菜單”文字鏈接時，鼠標指針變成了手指狀，同時該導(dǎo)航菜單所包括的菜單項就會顯示出來，將鼠標指針移動到所要瀏覽的菜單項單擊，即可打開相應(yīng)的網(wǎng)頁（目前我們還沒有制作相應(yīng)的網(wǎng)頁）。19第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁57第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.3創(chuàng)建“頁尾”文件

bottom.html文件以包含文件（<!--#includefile=“bottom.html”-->）的形式出現(xiàn)在首頁及相關(guān)文件中。創(chuàng)建bottom.html文件的操作及編輯完成后的bottom.html代碼請見書。

bottom.html在瀏覽器中的顯示效果如下圖所示。20第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁58第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.4創(chuàng)建“主體窗口左側(cè)”文件該文件以包含文件（<!--#includefile="left.aspx"-->）的形式出現(xiàn)在首頁文件中。創(chuàng)建left.aspx文件可分三個步驟進行。第一步，先創(chuàng)建一個名為gonggao.aspx的文件；第二步，創(chuàng)建一個名為link.html的文件；第三步，創(chuàng)建“主體窗口左側(cè)”文件（left.aspx），將gonggao.aspx和link.html文件以包含文件的形式出現(xiàn)在left.aspx

文件中。

1創(chuàng)建gonggao.aspx文件

2創(chuàng)建link.html文件

3創(chuàng)建left.aspx文件創(chuàng)建left.aspx文件的操作過程及步驟請見書。

left.aspx文件在瀏覽器中的顯示效果如右圖所示。21第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁59第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.5創(chuàng)建“主體窗口右側(cè)”文件該文件以包含文件（<!--#include

file="right.html"-->）的形式出現(xiàn)在首

頁文件中。創(chuàng)建right.aspx文件的操作及編輯

完成后的right.aspx代碼請見書。

right.aspx在瀏覽器中的顯示效果如右

圖所示。22第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁60第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.6創(chuàng)建“主體窗口中間部分”文件“主體窗口中間部分”文件的完整代碼請見書。由“主體窗口中間部分”文件代碼可以看出，整個文件包含在一個單元格<td>和</td>中，在這個單元格中包含一個表格<table></table>，這是一個三行一列的表格。下面我們逐行介紹。

1創(chuàng)建第一行內(nèi)容第一行代碼比較多，也比較復(fù)雜，請讀者仔細閱讀。

2創(chuàng)建第二行內(nèi)容第二行的代碼非常簡單，代碼請見書。

3創(chuàng)建第三行內(nèi)容第三行的單元格中，用于視頻顯示。編輯完成后“第三行”的完整代碼請見書。這里的視頻顯示是從從數(shù)據(jù)庫中讀取上傳的視頻的路徑在線播放。23第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁61第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.7常用“新聞瀏覽”文件創(chuàng)建“新聞瀏覽”幾乎出現(xiàn)在每個網(wǎng)站首頁中，因此，這里專門就“新聞瀏覽”文件的創(chuàng)建進行制作介紹。當打開“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站首頁時，會看到首頁中部窗口部分有許多新聞標題，用鼠標移動到某新聞標題時，鼠標指針會變成手指狀，單擊該標題會鏈接打開顯示該標題下詳細內(nèi)容的頁面，這個頁面文件就是“新聞瀏覽”文件（newsbrowser.aspx），也就是說，通過newsbrowser.aspx打開需要瀏覽的新聞內(nèi)容。下面介紹一下“新聞瀏覽”文件（newsbrowser.aspx）的創(chuàng)建過程?！靶侣劄g覽”文件newsbrowser.aspx的文件結(jié)構(gòu)如下頁圖所示。24第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁62第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.7常用“新聞瀏覽”文件創(chuàng)建“新聞瀏覽”文件newsbrowser.aspx的文件結(jié)構(gòu)圖。25第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁63第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.7常用“新聞瀏覽”文件創(chuàng)建“新聞瀏覽”文件的結(jié)構(gòu)和網(wǎng)站首頁的文件結(jié)構(gòu)比較，會發(fā)現(xiàn)兩者的頁眉、導(dǎo)航欄、主體窗口左側(cè)文件及頁腳部分完全相同，不同的是網(wǎng)頁的中部窗口的右側(cè)部分?！靶侣劄g覽”文件的中部窗口部分是左右結(jié)構(gòu)，主體窗口左側(cè)left.html文件以包含文件的形式出現(xiàn)在newsbrowser.aspx文件中，而且與首頁主體窗口左側(cè)left.html文件完全相同。而主體窗口右側(cè)則用來顯示頁面的主體部分。創(chuàng)建“新聞瀏覽”文件如同創(chuàng)建首頁一樣，也需分幾個步驟來進行。開始的步驟都是一樣的，操作如下：1.在【解決方案資源管理器】中，右鍵單擊D:\HLFWebSite\Chapter7\，在彈出菜單中選擇“添加新項”命令，打開的“添加新項”對話框。在“VisualStudio已安裝的模板”中單擊“Web窗體”，在“名稱”框中將文件名修改為newsbrowser.aspx，在“語言”下拉菜單中選擇VisualC#。26第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁64第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.3.7常用“新聞瀏覽”文件創(chuàng)建

2.單擊【添加】按鈕，newsbrowser.aspx便添加到D:\HLFWebSite\Chapter7目錄下，并且在編輯窗口自動打開newsbrowser.aspx。接下來，創(chuàng)建newsbrowser.aspx文件可分兩個步驟進行。第一步，創(chuàng)建“新聞瀏覽”文件主體窗口右側(cè)部分；第二步，給出newsbrowser.aspx文件完整代碼、后臺文件及代碼解釋。1創(chuàng)建“新聞瀏覽”文件主體窗口右側(cè)部分創(chuàng)建“新聞瀏覽”文件實際上主要是創(chuàng)建其主體窗口右側(cè)（主體）部分。因此，介紹創(chuàng)建newsbrowser.aspx文件實際上主要是介紹主體窗口右側(cè)部分，其代碼請見書。主體窗口右側(cè)部分就是上圖中的“主體部分”的內(nèi)容。整個部分是在<table>和</table>標記中。這是一個五行三列的表格，逐行介紹請見書。27第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁65第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁2“新聞瀏覽”文件newsbrowser.aspx完整代碼及代碼解釋編輯完成后的“新聞瀏覽”文件newsbrowser.aspx完整代碼請見書?！靶侣劄g覽”文件newsbrowser.aspx的后臺文件newsbrowser.aspx.cs代碼及解釋請見書。

7.3.8首頁的完整代碼及代碼解釋“科技服務(wù)咨詢管理系統(tǒng)”網(wǎng)站首頁（Default.aspx）的完整代碼請見書。首頁Default.aspx文件的后臺文件（Default.aspx.cs）代碼及解釋請見書。在首頁頁面中，單擊任何一新聞標題，都會通過newsbrowser.aspx打開需要瀏覽的新聞內(nèi)容。單擊任何一視頻標題，都會通過VedioPlay.aspx打開“科技前沿-視頻播放”頁面。28第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁66第7章：制作真實運行的網(wǎng)站及相關(guān)網(wǎng)頁7.4導(dǎo)航菜單中部分菜單項網(wǎng)頁的制作編輯完成該實例中的導(dǎo)航菜單共包含13項，即首頁、組織機構(gòu)、檢索查新、科研立項、知識產(chǎn)權(quán)、技術(shù)服務(wù)、論文著作、學(xué)生科技、校辦產(chǎn)業(yè)、成果展示、政策查詢、管理系統(tǒng)和下載專區(qū)。這里選擇表現(xiàn)形式具有代表性的“檢索查新”、“技術(shù)服務(wù)”和“校辦產(chǎn)業(yè)”菜單項網(wǎng)頁進行制作。

7.4.1“檢索查新”菜單項網(wǎng)頁的制作“檢索查新”導(dǎo)航菜單包括“檢索課堂”和“科技查新”兩個菜單項。當鼠標指針指向?qū)Ш綑谏系摹皺z索查新”文字鏈接時，鼠標指針變成了手指狀，同時“檢索查新”所包括的菜單項將會顯示出來，將鼠標指針移動到所要瀏覽的菜單項單擊，即可打開相應(yīng)的網(wǎng)頁。下面