當(dāng)前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
JSP网络聊天室
1. 實現(xiàn)思路
1.???? 登錄頁面
在頁面輸入用戶名密碼，提交到登錄邏輯頁面
2.???? 登錄邏輯頁面
調(diào)數(shù)據(jù)庫判斷用戶名密碼的正確性
正確：跳到聊天室界面并且存儲用戶名
錯誤：返回登錄界面
3．聊天室界面
?? 1.拿到存儲的用戶名
2.將發(fā)送的消息傳到聊天室邏輯頁面
3.拿到application中的值將application中的值展示到聊天記錄文本域中
?
4.聊天室邏輯頁面
將傳過來的消息用application域?qū)ο蟠鎯ζ饋?/strong>
獲取之前application中的值
2、邏輯思路圖
?
3、實例代碼：
Login.jsp? 登錄頁面
<form action="loginOpreation.jsp" method="post"> 用戶名：<input type="text" name="uname" ><br/> 密碼：<input type="password" name="upass" ><br/> <input type="submit" value="登錄" > </form>
LoginOperation.jsp?登錄邏輯頁面
<!-- 登錄邏輯頁面 --><%String uname=request.getParameter("uname");String upass=request.getParameter("upass");BuserDao bd=new BuserDao();Buser b=new Buser(uname,upass);if(bd.Login(b)){session.setAttribute("uname", uname);session.setAttribute("upass", upass);request.getRequestDispatcher("chatRoom.jsp").forward(request, response); }else{response.sendRedirect("login.jsp");}
chatRoom?? 聊天室
<head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- <meta http-equiv="refresh" content="5;url=chatRoom.jsp"> --><title>Insert title here</title><script type="text/javascript"> function $(o){return document.getElementById(o); } function s(){var str=$("input").value;if(str==""){alert("輸入框不能為空，請輸入！");}else{document.location="chatRoomOpreation.jsp?sendInfo="+str;;} } </script> </head> <body> <% request.setCharacterEncoding("UTF-8"); //獲取application中的值 String all=""; Object o=application.getAttribute("all"); if(o!=null){all=o.toString();} %><h1>多人聊天室</h1> 你好：<%=session.getAttribute("uname") %> <form method="post"> <div style="width:1000px; height:350px; overflow:auto; border:1px solid #000000;"> <%=all %> </div> <br/> <!-- 第二種，輸入框 --><input type="text" name="sendInfo" id="input"/> <!-- 第二種，富文本編輯器 --> <!-- <textarea rows="10" cols="10" name="sendInfo" id="1"></textarea> <script type="text/javascript">CKEDITOR.replace("sendInfo"); </script> --><input type="button" value="發(fā)送" οnclick="s()"> </form></body>
chatRoomOpreation.jsp 聊天室邏輯頁面
<!-- 聊天業(yè)務(wù)邏輯頁面 --> <% request.setCharacterEncoding("UTF-8"); //獲取用戶名，用戶名要拼接在發(fā)送的消息的前面 String uname=session.getAttribute("uname").toString(); //獲取application中記錄 String all=""; Object o=application.getAttribute("all"); if(o!=null){all=o.toString(); } //1.獲取要發(fā)送的內(nèi)容 String sendInfo=request.getParameter("sendInfo").toString(); if(sendInfo==null){request.setAttribute("flage","YES");request.getRequestDispatcher("chatRoom.jsp").forward(request, response);//response.sendRedirect("chatRoom.jsp"); } //將內(nèi)容拼接 if("admin".equals(uname)){all=all+"<br/>"+uname+":<span style='color:red'>"+sendInfo+"</span>"; } else if("sa".equals(uname)){all=all+"<br/>"+uname+":<span style='color:green'>"+sendInfo+"</span>"; } //富文本編輯器內(nèi)容拼接// all=all+"\r\n"+uname+":"+sendInfo; //2.將獲取的內(nèi)容存到application中 application.setAttribute("all",all); //3.跳轉(zhuǎn)到chatRoom.jsp頁面(重定向) response.sendRedirect("chatRoom.jsp");%>
總結(jié)
- 上一篇： 爱死磕金融黄金点评：小周期走势不明，操作
- 下一篇： ireport 循环_iReport制作