<!--?php session_start(); $uid = $_SESSION["uid"]; $date = date ("Y-m-d H:i:s"); require "../DB.class.php"; $db = new DB(); //选取该用户和该用户好友的动态，并按时间顺训读出 $sql = "select * from qqdongtai where uid='{$uid}' or uid in (select uid from qqfriends where fname =(select name from qqusers where uid='{$uid}')) order by time desc"; //echo $sql; $arr = $db--->strquery($sql); echo $arr; ?>
由上面可知：登录用户是lisi，由好友表可以知道，lisi的好友只有zhangsan和zhaoliu,那么显示的动态只能有lisi,zhangsan,和zhaoliu的。现在看一下效果及数据库~~~~
第四步：用bootstrap添加模态框用来评论动态
（1）引入文件：
<!--引入bootstrap的css文件--> <link type="text/css" href="https://www.jb51.net/bootstrap-3.3.7-dist/css/bootstrap.min.css" > <!--引入js包--> <!--引入bootstrap的js文件-->
（2）用模态框做评论效果：
<!-- 评论模态框（Modal） --> <div tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div> <div> <div> <button type="button" data-dismiss="modal" aria-hidden="true">×</button> <h4>评论</h4> </div> <textarea cols="80px"></textarea> <div> <button type="button" data-dismiss="modal">关闭</button> <button type="button">确定</button> </div> </div><!-- /.modal-content --> </div><!-- /.modal --> </div>
实现效果：（样式比较简陋）
点击“评论”：
到这一步基本就能实现动态的发布和显示好友动态了~~~~未完待续----评论和评论回复见下一篇随笔~~~
主页面全部代码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <!--引入bootstrap的css文件--> <link type="text/css" href="https://www.jb51.net/bootstrap-3.3.7-dist/css/bootstrap.min.css" /> <!--引入js包--> <script src="https://www.jb51.net/jquery-3.2.0.js"></script> <!--引入bootstrap的js文件--> <script src="https://www.jb51.net/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script> <style> #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; } </style> </head> <body> <div> <?php session_start(); $uid = ""; if(empty($_SESSION["uid"])) { header("location:login.php"); exit; } $uid = $_SESSION["uid"]; //这种方法可以取到uid。 echo "欢迎："."<span yh='{$uid}'>{$uid}</span>"; ?> <!--写动态--> <div> <p>发表动态：</p> <!--<form method="post" action="main-cl.php">--> <textarea cols="100px" rows="5px"></textarea> <input type="submit" value="发表" /> <!--</form>--> </div> <!--容纳动态内容--> <div> <p>朋友动态：<p> <div></div> </div> <!-- 评论模态框（Modal） --> <div tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div> <div> <div> <button type="button" data-dismiss="modal" aria-hidden="true">×</button> <h4>评论</h4> </div> <textarea cols="80px"></textarea> <div> <button type="button" data-dismiss="modal">关闭</button> <button type="button">提交评论</button> </div> </div><!-- /.modal-content --> </div><!-- /.modal --> </div> </div> </body> </html> <script> //刷新页面时将内容读取出来，并按发表时间读出来 $.ajax({ url:"sx-cl.php", dataType:"TEXT", success:function(data){ var hang = data.trim().split("|"); var str=""; for(var i=0;i<hang.length;i++) { var lie = hang[i].split("^"); str = str + "<div><span>"+lie[1]+"</span>发表动态：</div><div>"+lie[2]+"</p><div>发表动态时间："+lie[3]+"</div>"; str =str+"<div><button data-toggle='modal' data-target='#myModal'>评论</button><span><a href='del.php?code="+lie[0]+"'>删除动态</a></span></div>"; } $("#nr").html(str); //点击回复 } }); //当发表动态时，将动态内容写进数据库，并刷新页面 $("#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" ; } }); }) </script>