PHP仿qq空間或朋友圈發(fā)布動(dòng)態(tài)、評(píng)論動(dòng)態(tài)、回復(fù)評(píng)論、刪除動(dòng)態(tài)或評(píng)論的功能(上)
我們大部分人都發(fā)過(guò)動(dòng)態(tài),想必都知道發(fā)動(dòng)態(tài)、回復(fù)評(píng)論、刪除動(dòng)態(tài)的整個(gè)過(guò)程,那么作為初學(xué)者,要模仿這些功能有點(diǎn)復(fù)雜的,最起碼表的關(guān)系得弄清楚~~
先把思路理一下:
(1)用戶登錄,用session讀取當(dāng)前用戶----目的是:該用戶可以發(fā)表動(dòng)態(tài),重點(diǎn)是顯示該用戶好友及他自己發(fā)表的動(dòng)態(tài),并且按發(fā)表時(shí)間排序。
(2)做個(gè)發(fā)表動(dòng)態(tài)框?qū)崿F(xiàn)發(fā)表動(dòng)態(tài)功能
(3)顯示該用戶和他好友已經(jīng)發(fā)表對(duì)的動(dòng)態(tài)信息,并按發(fā)表時(shí)間由近到遠(yuǎn)顯示
(4)再每條動(dòng)態(tài)后面做一個(gè)評(píng)論按鈕和刪除按鈕;實(shí)現(xiàn)對(duì)動(dòng)態(tài)的評(píng)論,回復(fù)和刪除(斜體部分下一篇隨筆,不然太長(zhǎng)了)
需要用到的表:
(1)用戶表:
(2)好友表
(3)動(dòng)態(tài)表
我先將代碼分塊解析,最后將主頁(yè)代碼完整附上,不然弄不清邏輯可能會(huì)有點(diǎn)混~~~~
第一步:實(shí)現(xiàn)簡(jiǎn)單的登錄
(1)login.php頁(yè)面
<meta charset="UTF-8"> <title></title> <style> #body{ height: 300px; width: 300px; margin: 200px auto; } </style> <div id="body"> <form method="post" action="login-cl.php"> 用戶名:<input type="text" name="uid"><br><br> 密碼:<input type="password" name="pwd"><br> <input type="submit" value="登錄"> </form> </div>
效果圖如下:
(2)login-cl.php頁(yè)面:(用session存取用戶名)
<!--?php session_start(); $uid = $_POST["uid"]; $pwd = $_POST["pwd"]; require "../DB.class.php"; $db = new DB(); $sql = "select pwd from users where uid = '{$uid}'"; $mm = $db--->strquery($sql); var_dump($mm); if($mm == $pwd && !empty($pwd)) { $_SESSION["uid"] = $uid; header("location:main.php"); } else{ echo "用戶名或密碼錯(cuò)誤!"; } ?>
第二步:登錄之后,布局發(fā)布動(dòng)態(tài)框
(1)發(fā)布之前,判斷一下session是否已經(jīng)取到值,如果沒(méi)有,返回到登陸頁(yè)面,如果取到值則顯示“歡迎,xx”的字體(后面的姓名均用拼音顯示,不再讀取漢字的姓名)
<!--?php session_start(); $uid = ""; if(empty($_SESSION["uid"])) { header("location:login.php"); exit; } $uid = $_SESSION["uid"]; echo "歡迎:"."<span class='qid' yh='{$uid}'-->{$uid}"; ?>
(2)
<!--寫動(dòng)態(tài)--> <div id="xdt"> <p>發(fā)表動(dòng)態(tài):</p> <textarea cols="100px" rows="5px" name="xdt" class="xdt"></textarea> <input type="submit" value="發(fā)表" id="fb"> </div>
實(shí)現(xiàn)的效果:
第三步:顯示該用戶和他好友已經(jīng)發(fā)表的動(dòng)態(tài)信息,并按發(fā)表時(shí)間由近到遠(yuǎn)顯示
重點(diǎn)是:
(1)顯示的動(dòng)態(tài)只是登陸的該用戶和他好友的,非好友不顯示--------所以在處理頁(yè)面的sql語(yǔ)句要注意
(2)將讀取出來(lái)的信息按照發(fā)表時(shí)間讀取,發(fā)表時(shí)間最近的越在上邊
首先:
<!--容納動(dòng)態(tài)內(nèi)容--> <div class="fdt"> <p style="color: brown; font-family: '微軟雅黑';font-weight: bold;font-size: 20px; margin-bottom: 20px; margin-top: 20px;">朋友動(dòng)態(tài):</p><p> </p><div id="nr"></div> </div>
其次:
//當(dāng)發(fā)表動(dòng)態(tài)時(shí),將動(dòng)態(tài)內(nèi)容寫進(jìn)數(shù)據(jù)庫(kù),并刷新頁(yè)面 $("#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("發(fā)表動(dòng)態(tài)成功!"); window.location.href="main.php" rel="external nofollow" rel="external nofollow" ; } }); })
對(duì)應(yīng)的main-cl.php頁(yè)面:
<!--?php session_start(); $uid = $_SESSION["uid"]; $dt = $_POST["dt"]; $date = date ("Y-m-d H:i:s"); require "../DB.class.php"; $db = new DB(); $sql = "insert into qqdongtai values ('','{$uid}','{$dt}','{$date}')"; $db--->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; ?>
然后:
//刷新頁(yè)面時(shí)將內(nèi)容讀取出來(lái),并按發(fā)表時(shí)間讀出來(lái) $.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="" class="a"><span class="xm">"+lie[1]+"</span>發(fā)表動(dòng)態(tài):<div class="b">"+lie[2]+"<p></p><div class="c">發(fā)表動(dòng)態(tài)時(shí)間:"+lie[3]+"</div>"; str =str+"<div id="d"><button class="btn btn-primary" data-toggle="modal" data-target="#myModal">評(píng)論</button><span><a href="del.php?code=" rel="external nofollow" +lie[0]+"">刪除動(dòng)態(tài)</a></span></div>"; } $("#nr").html(str); } }); </div></hang.length;i++)>
sx-cl.php頁(yè)面:
<!--?php session_start(); $uid = $_SESSION["uid"]; $date = date ("Y-m-d H:i:s"); require "../DB.class.php"; $db = new DB(); //選取該用戶和該用戶好友的動(dòng)態(tài),并按時(shí)間順訓(xùn)讀出 $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,那么顯示的動(dòng)態(tài)只能有l(wèi)isi,zhangsan,和zhaoliu的?,F(xiàn)在看一下效果及數(shù)據(jù)庫(kù)~~~~
第四步:用bootstrap添加模態(tài)框用來(lái)評(píng)論動(dòng)態(tài)
(1)引入文件:
<!--引入bootstrap的css文件--> <link type="text/css" rel="stylesheet" href="../bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="external nofollow" rel="external nofollow" > <!--引入js包--> <!--引入bootstrap的js文件-->
(2)用模態(tài)框做評(píng)論效果:
<!-- 評(píng)論模態(tài)框(Modal) --> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title" id="myModalLabel">評(píng)論</h4> </div> <textarea class="modal-body" cols="80px"></textarea> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">關(guān)閉</button> <button type="button" class="btn btn-primary qdhf">確定</button> </div> </div><!-- /.modal-content --> </div><!-- /.modal --> </div>
實(shí)現(xiàn)效果:(樣式比較簡(jiǎn)陋)
點(diǎn)擊“評(píng)論”:
到這一步基本就能實(shí)現(xiàn)動(dòng)態(tài)的發(fā)布和顯示好友動(dòng)態(tài)了~~~~未完待續(xù)----評(píng)論和評(píng)論回復(fù)見下一篇隨筆~~~
主頁(yè)面全部代碼:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <!--引入bootstrap的css文件--> <link type="text/css" rel="stylesheet" href="../bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="external nofollow" rel="external nofollow" /> <!--引入js包--> <script src="../jquery-3.2.0.js"></script> <!--引入bootstrap的js文件--> <script src="../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; } /*誰(shuí)發(fā)表動(dòng)態(tài)樣式*/ .a{ float: left; min-height:40px; width: 1000px; border-bottom: 2px solid brown; } .xm{ font-size: 18px; color: brown; font-weight: bold; } /*發(fā)表動(dòng)態(tài)樣式內(nèi)容*/ .b{ float: left; text-align: left; height:100px; line-height: 50px; } /*發(fā)表時(shí)間與回復(fù)刪除樣式*/ .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 id="body"> <?php session_start(); $uid = ""; if(empty($_SESSION["uid"])) { header("location:login.php"); exit; } $uid = $_SESSION["uid"]; //這種方法可以取到uid。 echo "歡迎:"."<span class='qid' yh='{$uid}'>{$uid}</span>"; ?> <!--寫動(dòng)態(tài)--> <div id="xdt"> <p>發(fā)表動(dòng)態(tài):</p> <!--<form method="post" action="main-cl.php">--> <textarea cols="100px" rows="5px" name="xdt" class="xdt"></textarea> <input type="submit" value="發(fā)表" id="fb" /> <!--</form>--> </div> <!--容納動(dòng)態(tài)內(nèi)容--> <div class="fdt"> <p style="color: brown; font-family: '微軟雅黑';font-weight: bold;font-size: 20px; margin-bottom: 20px; margin-top: 20px;">朋友動(dòng)態(tài):<p> <div id="nr"></div> </div> <!-- 評(píng)論模態(tài)框(Modal) --> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title" id="myModalLabel">評(píng)論</h4> </div> <textarea class="modal-body" cols="80px"></textarea> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">關(guān)閉</button> <button type="button" class="btn btn-primary qdhf">提交評(píng)論</button> </div> </div><!-- /.modal-content --> </div><!-- /.modal --> </div> </div> </body> </html> <script> //刷新頁(yè)面時(shí)將內(nèi)容讀取出來(lái),并按發(fā)表時(shí)間讀出來(lái) $.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 class='a'><span class='xm'>"+lie[1]+"</span>發(fā)表動(dòng)態(tài):</div><div class='b'>"+lie[2]+"</p><div class='c'>發(fā)表動(dòng)態(tài)時(shí)間:"+lie[3]+"</div>"; str =str+"<div id='d'><button class='btn btn-primary' data-toggle='modal' data-target='#myModal'>評(píng)論</button><span><a href='del.php?code="+lie[0]+"'>刪除動(dòng)態(tài)</a></span></div>"; } $("#nr").html(str); //點(diǎn)擊回復(fù) } }); //當(dāng)發(fā)表動(dòng)態(tài)時(shí),將動(dòng)態(tài)內(nèi)容寫進(jìn)數(shù)據(jù)庫(kù),并刷新頁(yè)面 $("#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("發(fā)表動(dòng)態(tài)成功!"); window.location.href="main.php" rel="external nofollow" rel="external nofollow" ; } }); }) </script>
以上所述是小編給大家介紹的PHP仿qq空間或朋友圈發(fā)布動(dòng)態(tài)、評(píng)論動(dòng)態(tài)、回復(fù)評(píng)論、刪除動(dòng)態(tài)或評(píng)論的功能(上),希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
- PHP+Mysql無(wú)刷新問(wèn)答評(píng)論系統(tǒng)(源碼)
- PHP Ajax實(shí)現(xiàn)頁(yè)面無(wú)刷新發(fā)表評(píng)論
- PHP Ajax實(shí)現(xiàn)頁(yè)面無(wú)刷新發(fā)表評(píng)論
- 使用AngularJS和PHP的Laravel實(shí)現(xiàn)單頁(yè)評(píng)論的方法
- php實(shí)現(xiàn)評(píng)論回復(fù)刪除功能
- ThinkPHP上使用多說(shuō)評(píng)論插件的方法
- PHP抓取淘寶商品的用戶曬單評(píng)論+圖片+搜索商品列表實(shí)例
- 詳解WordPress中調(diào)用評(píng)論模板和循環(huán)輸出評(píng)論的PHP函數(shù)
- php實(shí)現(xiàn)文章評(píng)論系統(tǒng)
相關(guān)文章
PHP+Mysql+jQuery實(shí)現(xiàn)發(fā)布微博程序 php篇
這篇文章主要介紹了PHP+Mysql+jQuery實(shí)現(xiàn)發(fā)布微博程序,重要介紹后臺(tái)是如何處理前臺(tái)提交的數(shù)據(jù),并返回結(jié)果的,需要的朋友可以參考下2015-10-10Thinkphp5 自定義上傳文件名的實(shí)現(xiàn)方法
這篇文章主要介紹了Thinkphp5 自定義上傳文件名的實(shí)現(xiàn)方法,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2019-07-07Windows下部署Apache+PHP+MySQL運(yùn)行環(huán)境實(shí)戰(zhàn)
本來(lái)嘛,部署PHP沒(méi)什么復(fù)雜,找各種版本著實(shí)頭疼了一下。2012-08-08詳解PHP函數(shù) strip_tags 處理字符串缺陷bug
這篇文章主要介紹了詳解PHP函數(shù) strip_tags 處理字符串缺陷bug的相關(guān)資料,需要的朋友可以參考下2017-06-06php之header的不同用法總結(jié)(實(shí)例講解)
下面小編就為大家分享一篇php之header的不同用法總結(jié)(實(shí)例講解),具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2017-11-11Thinkphp模板標(biāo)簽if和eq的區(qū)別和比較實(shí)例分析
這篇文章主要介紹了Thinkphp模板標(biāo)簽if和eq的區(qū)別和比較,實(shí)例分析了Thinkphp模板標(biāo)簽if和eq用于變量比較的區(qū)別,需要的朋友可以參考下2015-07-07