ASP.NET網(wǎng)站聊天室的設(shè)計與實現(xiàn)(第3節(jié))
大家都玩過網(wǎng)站聊天室吧,那知道它是怎么實現(xiàn)的嗎?
今天我們就來設(shè)計一個網(wǎng)站聊天室,用戶輸入用戶名登陸聊天室,采用框架結(jié)構(gòu)實現(xiàn)。
學習內(nèi)容:
第一步,聊天室首頁與簡單計數(shù)器設(shè)計
1、打開VS2008。在“解決方案‘101'下新建網(wǎng)站,命名為Chatroom.默認首頁文件為Default.aspx。
2、為Default.aspx添加窗體控件,切換到“設(shè)計”視圖,從左側(cè)工具箱標準組中拖出2個Lable控件,1個Textbox控件,一個Button控件,最后給輸入昵稱的Textbox文本添加必填驗證。
在“設(shè)計”視圖中雙擊Btn1按鈕,在Default.aspx.cs中編寫如下事件代碼:
public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (Application["user_online"] == null) { Application["user_online"] = 0; } Application["user_online"] = (int)Application["user_online"] + 1; Label3.Text = "(現(xiàn)在共有" + Application["user_online"].ToString() + "人在線!)"; } protected void Button1_Click(object sender, EventArgs e) { if (Page.IsPostBack) { Session["User_name"]=this.Txt1.Text; Response.Redirect("chat.aspx"); } } }
第二步,構(gòu)建登錄字符串與發(fā)言字符串
1、創(chuàng)建Chat.aspx頁面文件,使用如下HTML語言可以編寫分框架頁面程序,把一個窗口分成兩半。左半窗口用來存放輸入發(fā)言內(nèi)容的頁面文件Inputwin.aspx,右半窗口用來存放顯示聊天內(nèi)容的頁面文件Showwin.aspx。
2、構(gòu)建登錄消息字符串。在Chat.aspx.cs的Page_Load事件中編寫代碼如下:
protected void Page_Load(object sender, EventArgs e) { string user_name = (string)Session["user_name"]; string sayStr = "來自" + (string)Request.ServerVariables["REMOTE_ADDR"] + "的"; sayStr = sayStr + "<b><font color=red>" + user_name + "</font></b>"; sayStr = sayStr + "于" + DateTime.Now + "大駕光臨"; Application.Lock(); Application["show"] = sayStr + "<br>" + Application["show"];I=I+1 Application.UnLock(); }
3、構(gòu)建發(fā)言內(nèi)容字符串。創(chuàng)建輸入發(fā)言內(nèi)容的頁面文件Inputwin.aspx。為頁面Inputwin.aspx添加控件,這里使用兩個DropDownList下拉列表框控件,分別用來選擇發(fā)言人的性別和心情,一個單行Textbox控件(對誰說);一個多行Textbox控件(發(fā)言內(nèi)容);一個Button按鈕(發(fā)言按鈕),最后添加驗證控件。
在“設(shè)計”視圖中雙擊Btn1(發(fā)言)按鈕,在Inputwin.aspx.cs文件的Btn_click事件中編寫代碼如下:
protected void Button1_Click(object sender, EventArgs e) { if (Page.IsPostBack == true) //頁面數(shù)據(jù)回傳 { String ssex, emotion, who; ssex = DropDownList1.SelectedItem.Value; //獲取性別 emotion = DropDownList2.SelectedItem.Text + "的"; //獲取發(fā)言時表情 who = "對" + "<b>" + TextBox2.Text + "</b>"; //獲取對誰說 //構(gòu)建發(fā)言字符串: String sayStr = "<font size='3' color='00ff00'><b>" + (string)Session["user_name"]; sayStr = sayStr + ssex + "</b></font>在" + DateTime.Now + emotion + who + " 說:"; sayStr = sayStr + TextBox3.Text; Application.Lock(); Application["show"] = sayStr + "<br>" + (string)Application["show"]; Application.UnLock(); TextBox3.Text = "";// 將發(fā)言框清空 } }
4、創(chuàng)建顯示發(fā)言字符串和發(fā)言內(nèi)容的頁面文件(Showwin.aspx),實現(xiàn)代碼如下:
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>無標題頁</title> <meta http-equiv="refresh" content="4"/> </head> <body> <form id="form1" runat="server"> <div> </div> </form> </body> </html>
在Showwin.aspx.cs的Page_Load事件中編寫代碼如下:
public partial class showwin : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { Response.Write((string)Application["show"]); } }
5、為離開聊天室頁面的Exit.aspx.cs文件編寫代碼如下:
protected void Page_Load(object sender, EventArgs e) { string sayStr = "<b>" + (string)Session["user_name"] + "</b>"; sayStr = sayStr + "于" + DateTime.Now + "離開聊天室了"; sayStr = "<font color='green'>" + sayStr + "</font>"; Application.Lock(); Application["show"] = sayStr + "<br>" + (string)Application["show"]; Application["user_online"] = (int)Application["user_online"] - 1; Application.UnLock(); Response.Redirect("chatroom.aspx"); }
6、運行聊天室首頁Default.aspx。
運行效果圖
總結(jié)
設(shè)計網(wǎng)站聊天室,聽起來就好像是已經(jīng)進入到了網(wǎng)站制作這個環(huán)節(jié),看到自己設(shè)計的一個功能很簡單的聊天室,有一點點的成就感,雖然這只是萬里長城的第一步。通過這次學習理解到了Session與Application的各自作用,學會了如何使頁面分成兩個窗口,如何找到正確的事件進行編寫,總體來說對網(wǎng)頁設(shè)計有了一些感覺,希望大家也能喜歡,試著設(shè)計一個屬于自己的網(wǎng)站聊天室吧
相關(guān)文章
asp.net core razor自定義taghelper的方法
這篇文章主要介紹了asp.net core razor自定義taghelper的方法,本文給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下2019-09-09MVC+EasyUI+三層新聞網(wǎng)站建立 后臺登錄界面的搭建(二)
這篇文章主要為大家詳細介紹了MVC+EasyUI+三層新聞網(wǎng)站建立的第二篇,教大家如何搭建后臺登錄界面,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-07-07asp.net(c#)網(wǎng)頁跳轉(zhuǎn)七種方法小結(jié)
在asp.net下,經(jīng)常需要頁面的跳轉(zhuǎn),下面是具體的幾種方法。跳轉(zhuǎn)頁面是大部編輯語言中都會有的,正面我們來分別介紹一下關(guān)于.net中response.redirect sever.execute server.transfer 三種頁面跳轉(zhuǎn)的方法2009-11-11asp.net下模態(tài)對話框關(guān)閉之后繼續(xù)執(zhí)行服務(wù)器端代碼的問題
asp.net下模態(tài)對話框關(guān)閉之后繼續(xù)執(zhí)行服務(wù)器端代碼的問題...2007-04-04ASP.NET?Core獲取正確查詢字符串參數(shù)示例
這篇文章主要為大家介紹了ASP.NET?Core正確獲取查詢字符串參數(shù),有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-05-05.net Core連接MongoDB數(shù)據(jù)庫的步驟詳解
這篇文章主要給大家介紹了關(guān)于.net Core連接MongoDB數(shù)據(jù)庫步驟的相關(guān)資料,文中將實現(xiàn)的步驟一步步介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧。2018-02-02