PHP开发简单留言本之完整的模...登陆

PHP开发简单留言本之完整的模块展示

2274.jpg

前面的准备工作已经基本完成

本章只要调用我们已经做好的各种类文件,JS文件,CSS文件

这里为了显示效果,我们没有调用JS文件和CSS文件,朋友们可以自己尝试。

<?php require_once("lydb.class.php");?>
<?php require_once("authority.class.php");?>

<?php
    session_start();
   $lydb=new LyDB();

   if(isset($_POST["type"])){
      if($_POST["type"]=="insert"){
         if(Authority::check_insert()==true){
            $lydb->insert($_POST["nickname"],"style/avatar/".$_POST["avatar"],$_POST["message"]);
            header("Location:index.php");
            exit();
         }
      }
      else if($_POST["type"]=="login"){
         if(isset($_POST["username"]) && isset($_POST["password"])){
            $dd=User::validate($_POST["username"],$_POST["password"]);
            if($dd==true){
               $_SESSION["username"]=$_POST["username"];
               header("Location:index.php");
               exit();
            }
            else{

            }
         }
      }
      else if($_POST["type"]=="reply"){
         $id=$_POST["id"];
         $reply=$_POST["reply"];
         $lydb->reply($id,$reply);
         header("Location:index.php");
         exit();
      }
   }
   else if(isset($_GET["type"])){
      if($_GET["type"]=="delete"&& isset($_GET["id"])){
         if(Authority::check_delete()==true){
            $lydb->delete_by_id($_GET["id"]);
            header("Location:index.php");
            exit();
         }
      }
      else if($_GET["type"]=="logout"){
         session_destroy();
         header("Location:index.php");
         exit();
      }
   }

?>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>简单留言本</title>
<style type="text/css">
   *{
      margin:0;
      padding:0;
      list-style-type:none;
      font-size:13px;
      font-family:'Helvetica Neue',Helvetica,Arial,Sans-serif;
   }
   body {
      background-color: #54B1EB;
   }
   #all_wrap {
      width: 100%;
      margin: 0 auto;
      margin-top:30px;
      background-color:#CCCCCC;
   }

   #header h1 {
      font-size: 36px;
      line-height:70px;
   }
   #header {
      margin: 0 auto;
      width: 90%;
   }
   #content {
      margin: 0 auto;
      width: 90%;
      border: 1px solid #3683D8;
   }
   .item {
      margin: 0 auto;
      width: 90%;
      border-bottom-width: 1px;
      border-bottom-style: dashed;
      border-bottom-color: #900;
      clear:both;
   }
   .a {
      float: left;
      width:60px;
      margin-top:5px;
   }

   /*留言列表*/
   .n,.t,.m{
      line-height:30px;
   }
   .n {
      float: left;
      color:#00F;
      padding-right:5px;
   }
   .t{
      color:#666;
   }
   .o {
      float: right;
   }
   .m{
      padding-left:60px;
      padding-right:30px;
      word-break:break-all;
   }
   /*新留言表单*/
   .form_line{
      clear:both;
      margin-top:10px;
   }
   .form_box {
      margin: 0 auto;
      width: 100%;
   }
   .form_text {
      float: left;
      width: 80px;
      text-align:right;
   }
   #form_select_avater label {
      width: 60px;
      display: block;
      float: left;
      text-align: center;
      cursor: pointer;
   }
   .form_input textarea {
      width: 50%;
      height: 70px;
   }
   #submit_0{
      width: 100px;
      height:30px;
   }
   #footer{
      margin: 0 auto;
      width: 90%;
   }
   .footer_message {
      line-height: 40px;

   }
   .pagination {
      text-align: center;
      margin:60px 30px 20px 30px;
   }
   .pagination a {
      display: inline-block;
      border: 1px solid #00F;
      padding-right: 8px;
      padding-left: 8px;
      padding-top: 2px;
      padding-bottom: 2px;
      text-decoration: none;
      color: #900;
      margin-right: 4px;
   }

   .pagination a:hover{
      border-color:#F0F;
      color:#000;
   }
   .login_button {
      float: right;
   }
   #submit_1 {
      width: 60px;
   }
   .login_form form label {
      float: left;
      display: block;
      width: 220px;
   }
   .login_form {
      padding-top: 20px;
   }
   .login_form form {
      display: block;
      border: 1px dashed #F0F;
      width: 520px;
      padding-top:10px;
      padding-bottom:10px;
      padding-left:3px;
   }
   .welcome_info {
      color: #900;
      float: right;
   }
   .r {
      color: #F00;
   }
   .retime{
      color:#666;
   }
   .login_button a{
      text-decoration:none;
   }
   #login_form{

      display:none;}
   @media only screen and (min-width: 410px){
      #all_wrap{
         width: 95%;
         margin: auto
      }
   }
   @media only screen and (min-width: 350px) and (max-width: 410px){
      #all_wrap{
         width: 95%;
         margin: auto
      }
   }
   }
   @media only screen and (max-width: 350px){
      #all_wrap{
         width: 95%;
         margin: auto
      }
   }
</style>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
   $(document).ready(function() {
      random_checked_avatar();
      $("#submit_0").click(validate_input);
//      toggle() 方法切换元素的可见状态。
//        如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素。
      $("#login_show_button").toggle(function(){
         $("#login_form").show(100);
         return false;
      },function(){
         $("#login_form").hide(100);
         return false;
      });

      $(".reply_button").click(function(){
         if($(this).parent().parent().children(".m").children(".reply_form_wrap").size()==0){
            //parent() 获得当前匹配元素集合中每个元素的父元素,使用选择器进行筛选是可选的。
            var id=$(this).attr("href");  //attr() 方法设置或返回被选元素的属性值。
            var reply_form=$("#reply_form").html();
            $(this).parent().parent().children(".m").append(reply_form);  //append() 方法在被选元素的结尾插入指定内容。
            $(this).parent().parent().children(".m").children(".reply_form_wrap").show(200);
            $(this).parent().parent().children(".m").children(".reply_form_wrap").children("form")
                  .children("input[name='id']").val(id);
         }
         return false;
      });
   });

   function random_checked_avatar(){
      var r=Math.random()*2; //返回介于 0 ~ 2 之间的一个随机数。
      $("#form_select_avater input:radio").eq(r).attr("checked","checked");
   }
   function validate_input(){
      var l=$("#nickname").val().trim().length;
      if(l==0) {alert("昵称不能为空");return false;};
      if(l>6) {alert("昵称要6个字符以内");return false;}
      l=$("#message").val().trim().length;
      if(l==0) {alert("留言内容不能为空");return false;}
      if(l>300) {alert("留言内容要300字符以内");return false;}
      return true;
   }
</script>
</head>
<body>

<div id="all_wrap">
   <div id="header">
        <?php if(!isset($_SESSION["username"])){?>
          <div class="login_form" id="login_form">
           <form action="index.php" method="post" >
              <label>用户名:
                <input name="username" type="text" /></label>
                <label>密码:
                  <input name="password" type="password" /></label>
                  <label style="width:65px;"><input type="submit" name="submit_1" id="submit_1" value="登录" /></label>
                <input name="type" type="hidden" value="login" />
                <div style="clear:both; line-height:0; height:0;"></div>
           </form>
          </div>
          <div class="login_button"><a href="#" id="login_show_button">管理员登录</a></div>
          <div style="clear:both; line-height:0; height:0;"></div>
          <?php } else {?>
          <div class="welcome_info">
           欢迎您:<?php echo $_SESSION["username"];?> &nbsp;&nbsp;&nbsp;
            <a href="index.php?type=logout">退出</a> </div>
          <?php }?>
             <h1>简单留言本</h1>
    </div>

   <div id="content">

        <?php if(Authority::check_insert()==true){?>
        <div class="form_box">
            <form action="index.php" method="post">
                    <div class="form_line">
                       <div class="form_text">您的昵称:</div>
                       <div class="form_input">
                     <input type="text" name="nickname" id="nickname"/>
                  </div>
                    </div>
                <div class="form_line">
                       <div class="form_text">选择头像:</div>
                       <div class="form_input" id="form_select_avater">
                         <label>
                                  <img src="style/avatar/1.jpg" width="48" height="48" />
                           <input name="avatar" type="radio" value="1.jpg" checked="checked" />
                         </label>
                                <label>
                                   <img src="style/avatar/2.jpg" width="48" height="48" />
                           <input type="radio" name="avatar" value="2.jpg" />
                         </label>
                                   <label>
                                   <img src="style/avatar/3.jpg" width="48" height="48" />
                           <input type="radio" name="avatar" value="3.jpg" />
                         </label>
                                <label>
                                   <img src="style/avatar/4.jpg" width="48" height="48" />
                           <input type="radio" name="avatar" value="4.jpg" />
                         </label>
                                   <label>
                                   <img src="style/avatar/5.jpg" width="48" height="48" />
                           <input type="radio" name="avatar" value="5.jpg" />
                         </label>
                                <label>
                                   <img src="style/avatar/6.jpg" width="48" height="48" />
                           <input type="radio" name="avatar" value="6.jpg" />
                         </label>
                                   <label>
                                   <img src="style/avatar/7.jpg" width="48" height="48" />
                           <input type="radio" name="avatar" value="7.jpg" />
                         </label>
                                <label>
                                   <img src="style/avatar/8.jpg" width="48" height="48" />
                           <input type="radio" name="avatar" value="8.jpg" />
                         </label>
                                <br style="clear:both;" />
                        </div>
                    </div>
                    <div class="form_line">
                       <div class="form_text">留言内容:</div>
                       <div class="form_input">
                     <textarea name="message" id="message"></textarea>
                  </div>
                    </div>
                    <div class="form_line">
                       <div class="form_text">&nbsp;</div>
                       <div class="form_input">
                     <input type="hidden" name="type" value="insert" />
                     <input type="submit" value="提交" id="submit_0" />
                  </div>
                    </div>
            </form>
                <div style="border-bottom:solid #00F 1px; margin:10px auto 10px auto;"></div>
         </div>
         <?php }//  if(Authority::check_insert()==true)
         ?>

         <div class="message_box">
            <ul class="list">
                <?php
               $page_result=$lydb->select_page_result($_GET["pn"]);
               $result=$page_result["page_data"];
                //$result=$lydb->select_all_result();
               while($row=mysqli_fetch_assoc($result)){
            ?>
                   <li class="item">
                       <div class="a">
                          <img src="<?php echo $row["avatar"];?>" width="50" height="50"  />
                        </div>
                   <div class="n"><?php echo $row["nickname"];?></div>
                        <div class="o">
                            <?php echo $row["id"];?>楼&nbsp;&nbsp;
                           <?php if(Authority::check_delete()==true){?>
                          <a href="<?php echo $row["id"];?>" class="reply_button">回复</a> &nbsp;
                             <a href="index.php?type=delete&amp;id=<?php echo $row["id"];?>">删除</a>
                            <?php }?>
                        </div>
                        <div class="t"><?php echo $row["lytime"];?></div>
                  <div class="m">
                           <p><?php echo $row["message"];?></p>
                     <?php
                     if(isset($row["reply"]) && trim($row["reply"])!=""){
                        echo "<p class='r'>";
                        echo "回复:".$row["reply"];
                        echo "<span class='retime'>__".$row["retime"]."</span>";
                        echo "</p>";

                     }
                     ?>
                      </div>
              </li>
                <?php } ?>
           </ul>
        </div>

          <div class="pagination" >
              当前第<?php echo $page_result["page_no"];?>页/
           共<?php echo $page_result["page_info"]["page_count"];?>页/
           每页显示<?php echo $page_result["page_info"]["page_size"]; ?>条/
           共<?php echo $page_result["page_info"]["ly_count"]; ?>条留言
          <a href="index.php?pn=<?php echo ($page_result['page_no']-1);?>">上一页</a>
          <a href="index.php?pn=<?php echo ($page_result['page_no']+1);?>">下一页</a>
          <a href="index.php?pn=1">首页</a>
          <a href="index.php?pn=<?php echo ($page_result['page_info']['page_count']);?>">尾页</a>
          </div>
  </div>
       <div id="footer">
         <div class="footer_message">
             <p>&nbsp;</p>
             <p style="text-align:right">2016</p>
           </div>
      </div>
</div>

<?php if(Authority::check_delete()==true){?>
<div id="reply_form" style="display:none;">
  <div class="reply_form_wrap" style="display:none;">
   <form action="index.php" method="post">
     <input type="hidden" name="type" value="reply" />
      <input type="hidden" name="id" value="" />
      <textarea name="reply" style="width:300px; height:40px;"></textarea>
           <input name="提交" type="submit" value="回复" style="width:60px; vertical-align:middle;" />
    </form>
    </div>
</div>
<?php }?>

</body>
</html>
?>

这样我们就完成了全部的功能。

注:本章节课程只是简单演示,其代码仅供学习参考。


<?php require_once("lydb.class.php");?> <?php require_once("authority.class.php");?> <?php session_start(); $lydb=new LyDB(); if(isset($_POST["type"])){ if($_POST["type"]=="insert"){ if(Authority::check_insert()==true){ $lydb->insert($_POST["nickname"],"style/avatar/".$_POST["avatar"],$_POST["message"]); header("Location:index.php"); exit(); } } else if($_POST["type"]=="login"){ if(isset($_POST["username"]) && isset($_POST["password"])){ $dd=User::validate($_POST["username"],$_POST["password"]); if($dd==true){ $_SESSION["username"]=$_POST["username"]; header("Location:index.php"); exit(); } else{ } } } else if($_POST["type"]=="reply"){ $id=$_POST["id"]; $reply=$_POST["reply"]; $lydb->reply($id,$reply); header("Location:index.php"); exit(); } } else if(isset($_GET["type"])){ if($_GET["type"]=="delete"&& isset($_GET["id"])){ if(Authority::check_delete()==true){ $lydb->delete_by_id($_GET["id"]); header("Location:index.php"); exit(); } } else if($_GET["type"]=="logout"){ session_destroy(); header("Location:index.php"); exit(); } } ?> <!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>简单留言本</title> <style type="text/css"> *{ margin:0; padding:0; list-style-type:none; font-size:13px; font-family:'Helvetica Neue',Helvetica,Arial,Sans-serif; } body { background-color: #54B1EB; } #all_wrap { width: 100%; margin: 0 auto; margin-top:30px; background-color:#CCCCCC; } #header h1 { font-size: 36px; line-height:70px; } #header { margin: 0 auto; width: 90%; } #content { margin: 0 auto; width: 90%; border: 1px solid #3683D8; } .item { margin: 0 auto; width: 90%; border-bottom-width: 1px; border-bottom-style: dashed; border-bottom-color: #900; clear:both; } .a { float: left; width:60px; margin-top:5px; } /*留言列表*/ .n,.t,.m{ line-height:30px; } .n { float: left; color:#00F; padding-right:5px; } .t{ color:#666; } .o { float: right; } .m{ padding-left:60px; padding-right:30px; word-break:break-all; } /*新留言表单*/ .form_line{ clear:both; margin-top:10px; } .form_box { margin: 0 auto; width: 100%; } .form_text { float: left; width: 80px; text-align:right; } #form_select_avater label { width: 60px; display: block; float: left; text-align: center; cursor: pointer; } .form_input textarea { width: 50%; height: 70px; } #submit_0{ width: 100px; height:30px; } #footer{ margin: 0 auto; width: 90%; } .footer_message { line-height: 40px; } .pagination { text-align: center; margin:60px 30px 20px 30px; } .pagination a { display: inline-block; border: 1px solid #00F; padding-right: 8px; padding-left: 8px; padding-top: 2px; padding-bottom: 2px; text-decoration: none; color: #900; margin-right: 4px; } .pagination a:hover{ border-color:#F0F; color:#000; } .login_button { float: right; } #submit_1 { width: 60px; } .login_form form label { float: left; display: block; width: 220px; } .login_form { padding-top: 20px; } .login_form form { display: block; border: 1px dashed #F0F; width: 520px; padding-top:10px; padding-bottom:10px; padding-left:3px; } .welcome_info { color: #900; float: right; } .r { color: #F00; } .retime{ color:#666; } .login_button a{ text-decoration:none; } #login_form{ display:none;} @media only screen and (min-width: 410px){ #all_wrap{ width: 95%; margin: auto } } @media only screen and (min-width: 350px) and (max-width: 410px){ #all_wrap{ width: 95%; margin: auto } } } @media only screen and (max-width: 350px){ #all_wrap{ width: 95%; margin: auto } } </style> <script type="text/javascript" src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { random_checked_avatar(); $("#submit_0").click(validate_input); // toggle() 方法切换元素的可见状态。 // 如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素。 $("#login_show_button").toggle(function(){ $("#login_form").show(100); return false; },function(){ $("#login_form").hide(100); return false; }); $(".reply_button").click(function(){ if($(this).parent().parent().children(".m").children(".reply_form_wrap").size()==0){ //parent() 获得当前匹配元素集合中每个元素的父元素,使用选择器进行筛选是可选的。 var id=$(this).attr("href"); //attr() 方法设置或返回被选元素的属性值。 var reply_form=$("#reply_form").html(); $(this).parent().parent().children(".m").append(reply_form); //append() 方法在被选元素的结尾插入指定内容。 $(this).parent().parent().children(".m").children(".reply_form_wrap").show(200); $(this).parent().parent().children(".m").children(".reply_form_wrap").children("form") .children("input[name='id']").val(id); } return false; }); }); function random_checked_avatar(){ var r=Math.random()*2; //返回介于 0 ~ 2 之间的一个随机数。 $("#form_select_avater input:radio").eq(r).attr("checked","checked"); } function validate_input(){ var l=$("#nickname").val().trim().length; if(l==0) {alert("昵称不能为空");return false;}; if(l>6) {alert("昵称要6个字符以内");return false;} l=$("#message").val().trim().length; if(l==0) {alert("留言内容不能为空");return false;} if(l>300) {alert("留言内容要300字符以内");return false;} return true; } </script> </head> <body> <div id="all_wrap"> <div id="header"> <?php if(!isset($_SESSION["username"])){?> <div class="login_form" id="login_form"> <form action="index.php" method="post" > <label>用户名: <input name="username" type="text" /></label> <label>密码: <input name="password" type="password" /></label> <label style="width:65px;"><input type="submit" name="submit_1" id="submit_1" value="登录" /></label> <input name="type" type="hidden" value="login" /> <div style="clear:both; line-height:0; height:0;"></div> </form> </div> <div class="login_button"><a href="#" id="login_show_button">管理员登录</a></div> <div style="clear:both; line-height:0; height:0;"></div> <?php } else {?> <div class="welcome_info"> 欢迎您:<?php echo $_SESSION["username"];?>
提交重置代码
章节评论笔记课件
  • 取消回复发送
  • 取消发布笔记发送