教案序號：.課題項(xiàng)目五任務(wù)1新聞功能前臺頁面制作授課形式√理論□理實(shí)一體□實(shí)訓(xùn)(驗(yàn))□其它：學(xué)時(shí)安排本單元總學(xué)時(shí)：2（其中：理論2學(xué)時(shí)、實(shí)踐學(xué)時(shí)）教學(xué)內(nèi)容及目標(biāo)掌握站點(diǎn)新聞添加、顯示、修改、刪除功能的制作，掌握功能模塊前臺頁面、后臺頁面的制作掌握實(shí)現(xiàn)站點(diǎn)新聞添加、顯示、修改、刪除功能的ASP代碼的編寫。教學(xué)重點(diǎn)及難點(diǎn)重點(diǎn)、難點(diǎn)：新聞添加、顯示、修改、刪除功能前臺與后臺的制作。新聞添加、顯示、修改、刪除功能的ASP代碼的編寫。授課對象學(xué)情分析學(xué)生接觸網(wǎng)站建設(shè)的相關(guān)內(nèi)容時(shí)間不長，雖然有網(wǎng)頁制作的基礎(chǔ)，但基礎(chǔ)較差，需要在講授過程中，教師進(jìn)行巡回指導(dǎo)或同學(xué)間小組討論。教學(xué)媒介機(jī)房授課地點(diǎn)5405教學(xué)過程及設(shè)計(jì)：一、課前回顧：登錄功能后臺設(shè)計(jì)中ASP代碼編寫問題？二、新課內(nèi)容：項(xiàng)目五任務(wù)1新聞功能前臺頁面制作任務(wù)1新聞功能前臺頁面制作一、任務(wù)引出電子商務(wù)網(wǎng)站首頁一般都以新聞標(biāo)題羅列的方式展示公司的最新動(dòng)態(tài)及相關(guān)資訊信息，瀏覽者可通過單擊標(biāo)題超級鏈接進(jìn)入到新聞資訊詳細(xì)瀏覽頁面。在本任務(wù)中，將要來完成諸暨市吉爾特機(jī)械有限公司新聞添加、顯示功能模塊前臺頁面、后臺頁面的制作以及相關(guān)數(shù)據(jù)表的設(shè)計(jì)，成功實(shí)現(xiàn)新聞添加、顯示功能。二、任務(wù)預(yù)覽打開并運(yùn)行站點(diǎn)文件夾里新聞管理頁面文件“newsmanage.asp”。當(dāng)網(wǎng)站里沒有發(fā)布新聞的時(shí)候，給出“對不起，目前沒有新聞……”的提示，如圖所示，當(dāng)網(wǎng)站里有新聞時(shí)，新聞主要以標(biāo)題羅列的方式展示公司的最新動(dòng)態(tài)及相關(guān)資訊信息，并且新聞的顯示都是根據(jù)發(fā)布日期倒序排列，最新的新聞顯示在最前面，如圖所示。新聞添加、顯示功能，首先通過點(diǎn)擊“發(fā)布新聞”按鈕鏈接到發(fā)布新聞信息頁面“addnews1.asp”，如圖所示。發(fā)布完新聞后，返回“newsmanage.asp”頁面，點(diǎn)擊新聞標(biāo)題，則彈出新聞內(nèi)容詳細(xì)的頁面“articleshow.asp”，將新聞的具體內(nèi)容顯示出來。具體效果如圖5-4所示。圖網(wǎng)站沒有發(fā)布新聞時(shí)的提示信息圖新聞信息羅列展示圖新聞信息添加頁面圖新聞內(nèi)容詳細(xì)顯示頁面三、實(shí)踐操作1、設(shè)計(jì)網(wǎng)站新聞添加的頁面在Dreamweaver環(huán)境下，選擇【文件】→【新建命令】，創(chuàng)建ASPVBScript頁面，并將網(wǎng)頁保存為“newsadd.asp”。具體的制作效果如圖所示。選中“題目”字段所對應(yīng)的文本框，命名為“title”；選中“作者”字段所對應(yīng)的文本框，將其命名為“author”；選中“來源”字段所對應(yīng)的文本框，將其命名為“source”；選中“年”字段所對應(yīng)的下拉菜單，將其命名為“timyear”；選中“月”字段所對應(yīng)的下拉菜單，將其命名為“timmonth”；選中“日”字段所對應(yīng)的下拉菜單，將其命名為“timday”；選中網(wǎng)頁右邊的文本域，將其命名為“content”。圖添加新聞頁面添加表單，使表單的開始標(biāo)簽與結(jié)束標(biāo)簽包圍整個(gè)新聞添加功能模塊。同時(shí)選中表單“form”，將表單的“action”屬性設(shè)置為“addnews1.asp”，“method”屬性設(shè)置為“post”，具體如下圖所示。圖表單動(dòng)作定義界面2、新聞添加信息提交處理頁面利用前面的模板，設(shè)計(jì)新聞提交信息后臺處理頁面“addnews1.asp”，具體設(shè)計(jì)制作效果如圖5-7所示。圖5-7新聞信息后臺處理頁面“addnews1.asp”是新聞信息后臺處理界面，該網(wǎng)頁中將新聞信息寫入到數(shù)據(jù)庫中的技術(shù)實(shí)現(xiàn)代碼如下。3、新聞添加成功頁面制作在進(jìn)行測試的時(shí)候從“addnews.asp”進(jìn)行預(yù)覽。在“addnews.asp”頁面中將新聞的信息添加完整，然后點(diǎn)擊“發(fā)表文章”按鈕，就會(huì)看到新聞添加成功的頁面。如圖所示。圖新聞添加成功頁面找到站點(diǎn)目錄，打開“webdata.mdb”的數(shù)據(jù)庫，并打開“newsarticle”數(shù)據(jù)表，再查看一下剛才所添加的新聞信息有沒有寫入到數(shù)據(jù)表中去。4、設(shè)計(jì)新聞信息羅列顯示的頁面在Dreamweaver環(huán)境下，選擇【文件】→【新建命令】，創(chuàng)建ASPVBScript頁面，并將網(wǎng)頁保存為“newsmanage.asp”。具體的制作效果如圖所示。圖新聞信息羅列顯示頁面制作效果四、小結(jié)商務(wù)網(wǎng)站首頁一般都以新聞標(biāo)題羅列的方式展示公司的最新動(dòng)態(tài)及相關(guān)資訊信息，瀏覽者可通過單擊標(biāo)題超級鏈接進(jìn)入到新聞資訊詳細(xì)瀏覽頁