我们大部分人都发过动态，想必都知道发动态、回复评论、删除动态的整个过程，那么作为初学者，要模仿这些功能有点复杂的，最起码表的关系得弄清楚~~

先把思路理一下：

(1)用户登录，用session读取当前用户----目的是：该用户可以发表动态，重点是显示该用户好友及他自己发表的动态，并且按发表时间排序。

(2)做个发表动态框实现发表动态功能

(3)显示该用户和他好友已经发表对的动态信息，并按发表时间由近到远显示

(4)再每条动态后面做一个评论按钮和删除按钮；实现对动态的评论，回复和删除(斜体部分下一篇随笔，不然太长了)

需要用到的表：

(1)用户表：

(2)好友表

(3)动态表

我先将代码分块解析，最后将主页代码完整附上，不然弄不清逻辑可能会有点混~~~~

第一步：实现简单的登录

(1)login.php页面

#body{

height: 300px;

width: 300px;

margin: 200px auto;

}

效果图如下：

(2)login-cl.php页面：(用session存取用户名)

strquery($sql);

var_dump($mm);

if($mm == $pwd && !empty($pwd))

{

$_SESSION["uid"] = $uid;

header("location:main.php");

}

else{

echo "用户名或密码错误！";

}

?>

第二步：登录之后，布局发布动态框

(1)发布之前，判断一下session是否已经取到值，如果没有，返回到登陆页面，如果取到值则显示“欢迎，xx”的字体(后面的姓名均用拼音显示，不再读取汉字的姓名)

{$uid}";

?>

(2)

实现的效果：

第三步：显示该用户和他好友已经发表的动态信息，并按发表时间由近到远显示

重点是：

(1)显示的动态只是登陆的该用户和他好友的，非好友不显示--------所以在处理页面的sql语句要注意

(2)将读取出来的信息按照发表时间读取，发表时间最近的越在上边

首先：

其次：

//当发表动态时，将动态内容写进数据库，并刷新页面

$("#fb").click(function(){

var dt= $(".xdt").val();

var uid = $(".qid").attr("yh");

$.ajax({

url:"main-cl.php",

data:{dt:dt},

type:"POST",

dataType:"TEXT",

success:function(data){

alert("发表动态成功！");

window.location.href="main.php" rel="external nofollow" rel="external nofollow" ;

}

});

})

对应的main-cl.php页面：

query($sql,0);

$sql = "select * from qqdongtai where uid='{$uid}' or uid in (select uid from qqfriends where fname =(select name from qqusers where uid='{$uid}'))";

//echo $sql;

$arr = $db->strquery($sql);

echo $arr;

?>

然后：

//刷新页面时将内容读取出来，并按发表时间读出来

$.ajax({

url:"sx-cl.php",

dataType:"TEXT",

success:function(data){

var hang = data.trim().split("|");

var str="";

for(var i=0;i"+lie[1]+"发表动态：

sx-cl.php页面：

strquery($sql);

echo $arr;

?>

由上面可知：登录用户是lisi，由好友表可以知道，lisi的好友只有zhangsan和zhaoliu,那么显示的动态只能有lisi,zhangsan,和zhaoliu的。现在看一下效果及数据库~~~~

第四步：用bootstrap添加模态框用来评论动态

(1)引入文件：

(2)用模态框做评论效果：

实现效果：(样式比较简陋)

点击“评论”：

到这一步基本就能实现动态的发布和显示好友动态了~~~~未完待续----评论和评论回复见下一篇随笔~~~

主页面全部代码：

#body{

height: auto;

width: 1000px;

margin: 0px auto;

}

#xdt{

height: 200px;

width:1000px;

border: 1px solid royalblue;

}

.fdt{

position: relative;

min-height:300px;

width: 1000px;

}

/*谁发表动态样式*/

.a{

float: left;

min-height:40px;

width: 1000px;

border-bottom: 2px solid brown;

}

.xm{

font-size: 18px;

color: brown;

font-weight: bold;

}

/*发表动态样式内容*/

.b{

float: left;

text-align: left;

height:100px;

line-height: 50px;

}

/*发表时间与回复删除样式*/

.c{

height:30px;

width: 800px;

float: left;

font-size: 12px;

text-align:right;

}

#d{

height:30px;

width: 200px;

float: left;

font-size: 15px;

text-align:center;

}

//刷新页面时将内容读取出来，并按发表时间读出来

$.ajax({

url:"sx-cl.php",

dataType:"TEXT",

success:function(data){

var hang = data.trim().split("|");

var str="";

for(var i=0;i

{

var lie = hang[i].split("^");

str = str + "