[原创+源码]超强:基于PHP+jQuery实现仿163邮箱的站内邮件系统二

最新推荐文章于 2023-02-15 10:19:01 发布

IT伟哥

最新推荐文章于 2023-02-15 10:19:01 发布

阅读量2.2k

点赞数

文章标签： jquery php url border session class

本文链接：https://blog.csdn.net/liwei3gjob/article/details/6522011

版权

接着上文 [原创+源码]超强:基于PHP+jQuery实现仿163邮箱的站内邮件系统一连载
   上文给大家展示了实现的效果，本篇文章将详细给大家讲一下如何实现用户登陆及登陆成功提醒页面
         注意，以下例子也你下载后无法正常运行属于正常，因为部分CSS文件和js文件还没有上传，我承诺一定会在该实例连载的最后一篇文章中上传本例所有的源代码~请大家支持我的原创论坛[3gput.com/3G开发者联盟]。
   首先，实现用户的登陆很简单，我以前做过讲解，主要是用户登陆的时候将用户名和用户id放入到session中
具体代码如下：
   用户登陆页面：

Code:

<html>
<head>
<title>未标题-1</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
body, p,td{
background-image: url(../images/Ml_BG.gif);
font-size: 9pt;
line-height: 16px;
}
a:link {
color: #ffffff;
text-decoration: none;
}
a:visited {
color: #f5f5f5;
text-decoration: none;
}
a:hover {
color: #ffffff;
text-decoration: none;
}
r:{color: #d20404;}
.r:a:link {
color: #d20404;
text-decoration: underline;
}
.r:a:visited {
color: #f5f5f5;
text-decoration: none;
}
.r:a:hover {
color: #d20404;
text-decoration: none;
}
.input-border{
border:1px solid #b8b8b8;
width:100px;
line-height:23px;
font-size:14px;
height:24px;
padding-left: 2px;
}
.input-border1{
border:1px solid #b8b8b8;
width:173px;
line-height:23px;
font-size:14px;
height:24px;
padding-left: 2px;
}
w:{color: #507ea4;}
.w:a:link {
color: #507ea4;
text-decoration: underline;
}
.w:a:visited {
color: #044275;
text-decoration: none;
}
.w:a:hover {
color: #507ea4;
text-decoration: none;
}
.login-b, .login-b2, .login-b3{
background-image: url(../images/b2.gif);
background-position: 0px 0px;
float: left;
height: 32px;
width: 82px;
display: block;
border:0;
margin-top: 7px;
*margin-top: 9px;
background-repeat: no-repeat;
margin-left: 23px;
cursor:pointer!important;
cursor:hand;
}
.login-b2{
background-image: url(../images/b2.gif);
background-position: 0px -33px;
}
.login-b3{
background-image: url(../images/b2.gif);
background-position: 0px -66px;
}
-->
</style>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<form method="post" action="logincheck.php" name="form1">
<table width="854" height="48" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td background="../images/ml_01.gif" style="text-indent:620px; color:#FFFFFF"><a href="">设为首页</a> | <a href="">加入收藏</a> | <a href="">3G开发者联盟</a></td>
</tr>
</table>
<table width="854" height="381" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td width="288" height="112" style="background-image:url(../images/ml_02.gif)"></td>
<td width="291" height="112" style="background-image:url(../images/ml_03.gif)"></td>
<td width="275" height="112" style="background-image:url(../images/ml_04.gif)"></td>
</tr>
<tr>
<td width="288" height="39" style="background-image:url(../images/ml_05.gif)"></td>
<td style="background-image:url(../images/ml_06.gif);" width="291" height="39"> <input type="text" name="user" maxlength="20" class="input-border" /></td>
<td width="275" height="39" style="background-image:url(../images/ml_07.gif)"></td>
</tr>
<tr>
<td width="288" height="39" style="background-image:url(../images/ml_08.gif)"></td>
<td width="291" height="39" style="background-image:url(../images/ml_09.gif)"> <input type="password" name="password" maxlength="20" class="input-border1"> <a href="" class="w">忘记密码?</a></td>
<td width="275" height="39" style="background-image:url(../images/ml_10.gif)"></td>
</tr>
<tr>
<td width="288" height="25" style="background-image:url(../images/ml_11.gif)"></td>
<td valign="middle" width="291" height="25" style="background-image:url(../images/ml_12.gif);color:#666"> <input type="checkbox" id="showsaveUser" name="showsaveUser"></td>
<td width="275" height="25" style="background-image:url(../images/ml_13.gif)"></td>
</tr>
<tr>
<td width="288" height="41" style="background-image:url(../images/ml_14.gif)"></td>
<td width="291" height="41" style="background-image:url(../images/ml_15.gif);"><input type="submit" value="" class="login-b" onMouseOver="this.className='login-b2'" onMouseDown="this.className='login-b3'" onMouseOut="this.className='login-b'"/></td>
<td width="275" height="41" style="background-image:url(../images/ml_16.gif)"></td>
</tr>
<tr>
<td width="288" height="19" style="background-image:url(../images/ml_17.gif)"></td>
<td><img src="../images/ml_18.gif" width="291" height="19" alt=""></td>
<td width="275" height="19" style="background-image:url(../images/ml_19.gif)"></td>
</tr>
<tr>
<td width="288" height="27" style="background-image:url(../images/ml_20.gif)"></td>
<td width="291" height="27" style="background-image:url(../images/ml_21.gif); color:#666">您还没有<font face="Arial">CSDN</font>的帐号吗？ <a href="" class="r">请立即注册</a></td>
<td width="275" height="27" style="background-image:url(../images/ml_22.gif)"></td>
</tr>
<tr>
<td width="288" height="79" style="background-image:url(../images/ml_23.gif)"></td>
<td width="291" height="79" style="background-image:url(../images/ml_24.gif)"></td>
<td width="275" height="79" style="background-image:url(../images/ml_25.gif)"></td>
</tr>
</table>
<table width="854" height="151" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td><img src="../images/ml_26.gif" width="854" height="151" alt=""></td>
</tr>
</table>
</form>
</body>
</html>

登陆处理逻辑页面logincheck.php

Code:

<?php
session_start();
include '../include/dbconn.php';
//定义sql
$sql="select id,username from member where username='{$_POST['user']}' and password='{$_POST['password']}'";
//执行查询
$rs=mysql_query($sql);
//取出结果集的个数
$result=mysql_num_rows($rs);
//判断是否查询成功
if($result){
//将查询数据存放到session中
$rows=mysql_fetch_assoc($rs);
$_SESSION['username']=$rows['username'];
$_SESSION['uid']=$rows['id'];
//登陆成功跳转到首页
header('location:./success.php?forward=./index.php&info=1');
}else{
//登陆失败，返回登陆页
header('location:./login.html');
}
?>

最为关键的是，当用户登陆后提示用户登陆成功信息，这里我做了一个通用的页面 success.php,这个页面接受用户的请求，并且进行重定位url，同时接受提示消息的编号值，根据编号值使用switch case 语句定义要显示的内容，最后显示出来，具体代码如下：

Code:

<?php
//接收用户的去向（forward）
$forward=$_GET['forward'];
//接受信息提示内容编号
$info=$_GET['info'];
switch($info){
case 1:$str="登陆成功！";break;
case 2:$str="插入成功！";break;
case 3:$str="删除成功！";break;
case 4:$str="更新成功！<br>本次操作影响了 {$_GET['num']} 条记录";break;
case 5:$str="信息发送成功！";break;
case 6:$str="收件人不存在！";break;
case 7:$str="当前用户已成功注销";break;
case 8:$str="请登录后操作！";break;
default:$str="操作成功！";
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="../css/style.css" type="text/css" rel="stylesheet" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="javascript" type="text/javascript" src="../script/jquery-1.5.1.min.js"></script>
<script language="javascript" type="text/javascript">
$(function(){
/**********弹出层效果开始*************/
//获得整个浏览器的宽度
var bwidth=$(window).width();
//获得整个浏览器的高度
var bheight=$(window).height();
//获得上下滚动条滚动的高度
var sTop=$(window).scrollTop();
//获得左右滚动条滚动的宽度
var sLeft=$(window).scrollLeft();
//获得窗口的宽度
var winwidth=$("#center").width();
//获得整个窗口的高度
var winheight=$("#center").height();
//计算弹出窗口的坐标
var left1=sLeft+(bwidth-winwidth)/2;
var top1=sTop+(bheight-winheight)/2;
//设置窗口的样式，并显示出窗口出来
$("#center").css("left",left1).css("top",top1);
//设置窗口显示方式为show
$("#center").show("slow");
$(".title img").click(function(){
$(this).parent().parent().hide("slow");
});
});
</script>
<title>成功提示</title>
</head>
<body>
<script language="javascript" type="text/javascript">
function forward1(){
location='<?php echo $forward;?>';
}
setTimeout("forward1()",3000);
</script>
<div class="window" id="center">
<div class="title"><img src="../../images/close.jpg" />信息提示</div>
<div class="content"><br><br><font color="#FF0000"><b><?php echo $str;?></b></font><br>三秒钟以后页面自动跳转</div>
</div>
</body>
</html>