php实现简易留言板效果

首先是Index页面效果图

index.php

<?php
header(‘content-type:text/html;charset=utf-8‘);
date_default_timezone_set(‘PRC‘);
$filename="msg.txt";
$msgs=[];
//检测文件是否存在
if(file_exists($filename)){
  //读取文件中的内容
  $string=file_get_contents($filename);
  if(strlen($string)>0){
    $msgs=unserialize($string);
  }
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="http://www.francescomalagrino.com/BootstrapPageGenerator/3/js/jquery-2.0.0.min.js"></script>
<script type="text/javascript" src="http://www.francescomalagrino.com/BootstrapPageGenerator/3/js/jquery-ui"></script>
<link href="http://www.francescomalagrino.com/BootstrapPageGenerator/3/css/bootstrap-combined.min.css" rel="stylesheet" media="screen">
<script type="text/javascript" src="http://www.francescomalagrino.com/BootstrapPageGenerator/3/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container-fluid">
    <div class="row-fluid">
        <div class="span12">
            <div class="page-header">
                <h1>
                    简易留言板-<span>V1.0</span>
                </h1>
            </div>
            <div class="hero-unit">
                <h1>
                    Hello, world!
                </h1>
                <p>
                    这是一个可视化布局模板, 你可以点击模板里的文字进行修改, 也可以通过点击弹出的编辑框进行富文本修改. 拖动区块能实现排序.
                </p>
                <p>
                    <a rel="nofollow" class="btn btn-primary btn-large" href="#">参看更多 »</a>
                </p>
            </div>
             <?php if(is_array($msgs)&&count($msgs)>0):?>
            <table class="table">
                <thead>
                    <tr>
                        <th>
                            编号
                        </th>
                        <th>
                            用户名
                        </th>
                        <th>
                            标题
                        </th>
                        <th>
                            时间
                        </th>
                        <th>
                            内容
                        </th>
                        <th>
                            操作
                        </th>
                    </tr>
                </thead>
                <tbody>
                <?php $i=1;foreach($msgs as $key=>$val):?>
              <tr class="success">
              <td>
                <?php echo $i++;?>
              </td>
              <td>
                <?php echo $val[‘username‘];?>
              </td>
              <td>
                <?php echo $val[‘title‘];?>
              </td>
              <td>
                <?php echo date("m/d/Y H:i:s",$val[‘time‘]);?>
              </td>
              <td>
                <?php echo $val[‘content‘];?>
              </td>
              <td>
                <a href="edit.php?id=<?php echo $key;?>">编辑</a>|<a href="#" onclick="show_confirm(<?php echo $key;?>)">删除</a>
              </td>
            </tr>
            <?php endforeach;?>
                </tbody>
            </table>
            <?php endif;?>
            <input type="button" class="btn btn-primary btn-lg" name="pubMsg" value="我要留言" onclick="window.location.href=‘add.php‘"/>
        </div>
    </div>
</div>
<script type="text/javascript">
    function show_confirm(key){
        var r=confirm("确定删除吗?");
        if (r==true){
              location.href=‘delete.php?id=‘+key;
        }
    }
    </script>
</body>
</html>

然后是新增留言页面效果图

add.php

<?php
header(‘content-type:text/html;charset=utf-8‘);
date_default_timezone_set(‘PRC‘);
$filename="msg.txt";
$msgs=[];
//检测文件是否存在
if(file_exists($filename)){
  //读取文件中的内容
  $string=file_get_contents($filename);
  if(strlen($string)>0){
    $msgs=unserialize($string);
  }
}
//检测用户是否点击了提交按钮
if(isset($_POST[‘addMsg‘])){
  $username=$_POST[‘username‘];
  $title=strip_tags($_POST[‘title‘]);
  $content=strip_tags($_POST[‘content‘]);
  $time=time();
  //将其组成关联数组
  $data=compact(‘username‘,‘title‘,‘content‘,‘time‘);
  array_push($msgs,$data);
  $msgs=serialize($msgs);
  if(file_put_contents($filename,$msgs)){
    echo "<script>alert(‘留言成功!‘);location.href=‘index.php‘;</script>";
  }else{
    echo "<script>alert(‘留言失败!‘);location.href=‘index.php‘;</script>";
  }
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="http://www.francescomalagrino.com/BootstrapPageGenerator/3/js/jquery-2.0.0.min.js"></script>
<script type="text/javascript" src="http://www.francescomalagrino.com/BootstrapPageGenerator/3/js/jquery-ui"></script>
<link href="http://www.francescomalagrino.com/BootstrapPageGenerator/3/css/bootstrap-combined.min.css" rel="stylesheet" media="screen">
<script type="text/javascript" src="http://www.francescomalagrino.com/BootstrapPageGenerator/3/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container-fluid">
    <div class="row-fluid">
        <div class="span12">
            <div class="page-header">
                <h1>
                    简易留言板-<span>V1.0</span>
                </h1>
            </div>
            <div class="hero-unit">
                <h1>
                    你终于来了!
                </h1>
                <p>
                    这是一个添加留言的留言板,你在下面愉快的留言吧!
                </p>
                <p>
                    <a rel="nofollow" class="btn btn-primary btn-large" href="#">参看更多 »</a>
                </p>
            </div>
            <form action="#" method="post">
                <fieldset>
                    <legend>发布</legend>
                       <label>用户名</label><input type="text" name="username" required />
                       <label>标题</label><input type="text" name="title" required />
                       <label>内容</label><textarea name="content" rows="5" cols="30" required></textarea>
                       <hr>
                       <input type="submit" class="btn btn-primary btn-lg" name="addMsg" value="发布留言"/>
                       <input type="button" class="btn btn-primary btn-lg" value="查看留言" onclick="window.location.href=‘index.php‘"/>
                </fieldset>
            </form>
        </div>
    </div>
</div>
</body>
</html>

编辑留言页面

edit.php

<?php
header(‘content-type:text/html;charset=utf-8‘);
date_default_timezone_set(‘PRC‘);
$filename="msg.txt";
$msgs=[];
$id=$_GET[‘id‘];//获取id
//检测文件是否存在
if(file_exists($filename)){
  //读取文件中的内容
  $string=file_get_contents($filename);
  if(strlen($string)>0){
    $msgs=unserialize($string);
  }
}
//获取已有的留言信息
$username=$msgs[$id][‘username‘];
$title=strip_tags($msgs[$id][‘title‘]);
$content=strip_tags($msgs[$id][‘content‘]);
$time=$msgs[$id][‘time‘];
//检测用户是否点击了编辑按钮
if(isset($_POST[‘editMsg‘])){
  //将修改后的留言写入文档
  $msgs[$id][‘username‘]=$_POST[‘username‘];
  $msgs[$id][‘title‘]=strip_tags($_POST[‘title‘]);
  $msgs[$id][‘content‘]=strip_tags($_POST[‘content‘]);
  $msgs[$id][‘time‘]=time();
  $msgs=serialize($msgs);
  if(file_put_contents($filename,$msgs)){
    echo "<script>alert(‘编辑成功!‘);location.href=‘index.php‘;</script>";
  }else{
    echo "<script>alert(‘编辑失败!‘);location.href=‘index.php‘;</script>";
  }
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="http://www.francescomalagrino.com/BootstrapPageGenerator/3/js/jquery-2.0.0.min.js"></script>
<script type="text/javascript" src="http://www.francescomalagrino.com/BootstrapPageGenerator/3/js/jquery-ui"></script>
<link href="http://www.francescomalagrino.com/BootstrapPageGenerator/3/css/bootstrap-combined.min.css" rel="stylesheet" media="screen">
<script type="text/javascript" src="http://www.francescomalagrino.com/BootstrapPageGenerator/3/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container-fluid">
    <div class="row-fluid">
        <div class="span12">
            <div class="page-header">
                <h1>
                    简易留言板-<span>V1.0</span>
                </h1>
            </div>
            <div class="hero-unit">
                <h1>
                    再来修改下~
                </h1>
                <p>
                    这是用来修改留言的地方哦!
                </p>
                <p>
                    <a rel="nofollow" class="btn btn-primary btn-large" href="#">参看更多 »</a>
                </p>
            </div>
            <form action="#" method="post">
                <fieldset>
                    <legend>编辑</legend>
                       <label>用户名</label><input type="text" name="username" value="<?php echo $username;?>" required />
                       <label>标题</label><input type="text" name="title"  value="<?php echo $title;?>" required />
                       <label>内容</label><textarea name="content" rows="5" cols="30" required><?php echo $content;?></textarea>
                       <hr>
                       <input type="submit" class="btn btn-primary btn-lg" name="editMsg" value="编辑完成"/>
                       <input type="button" class="btn btn-primary btn-lg" value="查看留言" onclick="window.location.href=‘index.php‘"/>
                </fieldset>
            </form>
        </div>
    </div>
</div>
</body>
</html>

此时储存的留言信息:msg.txt

a:2:{i:3;a:4:{s:8:"username";s:3:"cyy";s:5:"title";s:12:"cyy又来了";s:7:"content";s:27:"cyy经常来留言!!!";s:4:"time";i:1565510381;}i:4;a:4:{s:8:"username";s:3:"cyy";s:5:"title";s:17:"cyy2020第一踩~";s:7:"content";s:17:"cyy2020第一踩~";s:4:"time";i:1578723602;}}

原文地址:https://www.cnblogs.com/chenyingying0/p/12179811.html

时间: 2024-10-10 20:55:59

php实现简易留言板效果的相关文章

DOM操作相关案例 模态对话框,简易留言板,js模拟选择器hover,tab选项卡,购物车案例

1.模态框案例 需求: 打开网页时有一个普通的按钮,点击当前按钮显示一个背景图,中心并弹出一个弹出框,点击X的时候会关闭当前的模态框 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ padding: 0; margin: 0; }

JSP+Servlet+JavaBean传统方式实现简易留言板制作(注册、登录、留言)

学JavaEE也有一段时间了,跟着老师和教材做了不少东西,但是一直以来没时间写博客,今天就把以前写的一个简易留言板简单发一下吧. 开发工具 主要用的开发工具为 MyEclipse(2014.2016均可).Tomcat 7.0.SQL Server 2016.SSMS数据库管理工具.浏览器等. 开发环境 开发环境为windows系统,已安装配置Java最新版开发环境. 主要功能与语言 登录.注册.并可以在留言板留言,所有留言内容均可见. 所采用JSP+Servlet+JavaBean传统方式,仅

6.2.13 简易留言板

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>留言板</title> </head> <body> <h1>简易留言板</h1> <div id="box"> <!--<ul> </ul>--> </div> <

微信小程序实现简易留言板

微信小程序现在很火,于是也就玩玩,做了一个简易的留言板,让大家看看,你们会说no picture you say a j8 a,好吧先上图. 样子就是的,功能一目了然,下面我们就贴实现的代码,首先是HTML页面,好吧,其实微信小程序的是wxml(微信ml)总感觉怪怪的,有木有. 1 <!--index.wxml--> 2 <view class="msg-box"> 3 <!--留言--> 4 <view class="send-bo

用js做一个简单的留言板效果

html部分: 1: <!DOCTYPE> 2: <html lang="zh-en"> 3: <head> 4: <title>js实现简单留言板</title> 5: <meta http-equiv="content-type" content="text/html;charset=utf-8"> 6: <link rel="stylesheet&quo

element-ui + vue 简易留言板

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>留言板</title> <!-- 引入样式 --> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-default/index.css"> <

jsp做的一个简易留言板功能

1.先登录才能留言 2.可以留言 3.可以回复 4.自己写的留言可以自己删除 5.留言进行分页显示,避免留言只能显示一部分 1.登录后会有 2.写留言 提交按钮在你没写东西前是不能提交的,用了onkeyup()方法 提交后马上显示在留言列表,ajax技术 相关代码: function sendtext(){ var text1=form1.textfield.value; if(text1!=""){ createRequest1("insert1.jsp?textfield

vue实现简易留言板

首先引入vue.js <script src="vue.js"></script> 布局 <div id="div"> <input type="text" v-model="username" @keyup.enter="add()"> <input type="button" value="按钮" @click

js简易留言板

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <link rel="stylesheet" type="text/css" href="css/reply.css"/> <body> <div id=&quo