三大改造完成时间,我的web2.0作品:畅想网络应用系统(采用JavaScript、Jquery、Ajax 等制作,完成时间4天)
1、进入主界面:
2、双击“畅享聊天室”图标:(以下窗口均可拖动,不作拖动说明。)
定义了一个cookie的值,这个至为空时,弹出提示窗口,按下“确定”键后,弹出一下注册窗口:
(如果登录成功后,此时系统自动进入聊天室, 此时cookie值为用户名,不为空,双击“畅享聊天室”图标也可进入聊天室。)
点击“会员注册”按钮:
进入房间后,系统自动告诉所有人“大家好,我进入房间了!”(所有时间均取为当前最新时间,聊天功能的实现是:<1>往数据库中插入数据:包括当前时间、说话者和聊天信息。<2>制定一个定时器,每100毫秒从数据库中读取最新数据信息)
点击“查看资料”,系统将从数据库中调取个人信息,返回显示在页面上:
3、双击 “畅享音乐”图标实现音乐器功能:(前期自己做了一个附有列表的音乐播放器,调用
"); 30 $("#msgBoard").append(li); 31 32 } 33 } else { 34 alert("网络连接错误!"); 35 } 36 }); 37 } 38 39 //结束 40 (3)//页面加载时图片#imgloading显示 41 document.onreadystatechange = function () { 42 if (document.readyState == "complete") { 43 $("#imgloading").hide("slow"); 44 } 45 }; //结束 46 47 $(function () { 48 //实现鼠º标经过元素时元素变大,鼠标离开时还原- 49 $("#menubar img").mouseover( 50 function () { 51 $(this).animate({ width: "110px", height: "110px" }); 52 } 53 ).mouseout(function () { 54 $(this).animate({ width: "100px", height: "100px" }); 55 }); //结束 56 //实现双击#imglogin图片时弹出对话框 57 $("#imglogin").dblclick(function () { 58 $("#login").dialog({ width: "400px" }); 59 60 }); //结束 61 (4)//用Ajax技术实现登陆功能 62 $("#loginBtn").click(function () { 63 username = $("#username").val(); 64 pwd = $("#pwd").val(); 65 $.post("login.ashx", { "username": username, "userpwd": pwd }, function (returnData, status) { 66 if (status == "success") { 67 if (returnData == "success") { 68 $("#chating").dialog({ width: "700px" }); 69 70 //给cookie赋值 71 $.cookie("login_cooke", null); 72 73 $.cookie("login_cookie", username); 74 $.cookie("login_cookie_toanother", "ture"); //实现两个窗口登录时的cookie 75 $.cookie("login_cookiepwd", pwd); 76 cookie_username = $.cookie("login_cookie"); 77 cookie_pwd = $.cookie("login_cookiepwd"); 78 //结束 79 //设置获取聊天信息的定时器 80 setInterval("getmsg()", 200); 81 //结束 82 (5) 83 //Ajax技术实现注册对话框与功能 84 $("#registerBt").click(function () { 85 $("#register").dialog({ width: "400px" }); 86 $("#login").dialog("destroy"); 87 88 }); 89 90 $("#subRegisterBt").click(function () { 91 $("#register").dialog("destroy"); 92 var regUsername = $("#regUsername").val(); 93 var regUserpwd = $("#regUserpwd").val(); 94 var regUserpwdConfirm = $("#regUserpwdConfirm").val(); 95 var regUserSex = $("#regUserSex").val(); 96 var regUserBirthday = $("#regUserBirthday").val(); 97 var regUserQQ = $("#regUserQQ").val(); 98 var regUserEmail = $("#regUserEmail").val(); 99 if (regUserpwd == regUserpwdConfirm) {
100 101 $.post("register.ashx", { "regUsername": regUsername, "regUserpwd": regUserpwd, "regUserSex": regUserSex, "regUserBirthday": regUserBirthday, "regUserQQ": regUserQQ, "regUserEmail": regUserEmail },
102 function (returnData, status) {
103 if (status == "success")
104 if (confirm(returnData))
105 $("#login").dialog({ width: "400px" });
106 else;
107 else
108 alert("网络连接错误!");
109 110 });
111 }
112 else {
113 alert("两次输入密码不一致!请重新输入!");
114 $("#register").dialog({ width: "400px" });
115 }
116 });
117 //结束
118 //Ajax技术实现发送信息功能
119 $("#sendMsgBt").click(function () {
120 var msg = $("#sendMsgValue").val();
121 var username = $("#username").val();
122 $.post("sendMsg.ashx", { "sendMsgValue": msg, "timenow": timenow, "username": username }, function (returnData, status) {
123 if (status == "success") {
124 document.getElementById("sendMsgValue").value = "";
125 126 //实现鼠标点进发送框时,信息栏自动显示最下面的内容
127 var p = $("#msgBoard").scrollTop();
128 $("#msgBoard").scrollTop(p + 9999999);
129 //结束
130 }
131 else {
132 alert("网络连接错误!");
133 }
134 });
135 136 });
137 //结束
138 (5)视频播放器
所包含的文件的内容:
139 140
141
156 (6)音乐播放器:
157
158 我的音乐
159
160
161
162
163
164
175
176
177 (7)数据库方面的代码这里只放一个login.ashx文件全部的代码,
178 using System;
179 using System.Collections.Generic;
180 using System.Linq;
181 using System.Web;
182 using web.webDataSetTableAdapters;
183 namespace web
184 {
185 public class login : IHttpHandler
186 {
187 public void ProcessRequest(HttpContext context)
188 {
189 context.Response.ContentType = "text/plain";
190 string username=context.Request["username"];
191 string userpwd = context.Request["userpwd"];
192 T_UserTableAdapter adapter=new T_UserTableAdapter();
193 var user = adapter.checkUser(username,userpwd);
194 if (user.Rows.Count == 1)
195 {
196 context.Response.Write("success");
197 }
198 else
199 {
200 context.Response.Write("error"); 201 }
202 }
203 public bool IsReusable
204 {
205 get
206 {
207 return false;
208 }
209 }
210 }
211 }
希望大家不吝赐教,对我提出建议,十分感谢!大三暑假想去实习,请问大家有什么好公司介绍吗?
若需要源代码可直接加我QQ:1039189349,并写明来意,谢谢!
延伸阅读
最新评论