php博客小作业

最新推荐文章于 2024-06-19 10:48:48 发布

向来缘浅奈何晴深

最新推荐文章于 2024-06-19 10:48:48 发布

阅读量2.6k

点赞数 6

分类专栏： php 文章标签： php

本文链接：https://blog.csdn.net/lzq_20150715/article/details/76026497

版权

php 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

用php实现写博客，查看列表，编辑博客，删除博客的小功能，用了bootstrap框架，用了ueditor编辑器。

主要代码如下：

博客编辑页面

效果图

这里写图片描述

主要代码

blog.html

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<title>博客</title>
</head>

<body>
  <div class="container">
  <!-- <form> 标签的 enctype 属性规定了在提交表单时要使用哪种内容类型。在表单需要二进制数据时，比如文件内容，请使用 "multipart/form-data"。 -->
  <!--点击保存修改就跳转到add.php-->
  <form class="form-horizontal" action="add.php" method="post" enctype="multipart/form-data">
  <div class="form-group">
    <label for="blogTitle" class="col-sm-2 control-label">博文标题</label>
    <div class="col-sm-10">
      <input type="text" class="form-control" id="blogTitle" placeholder="博文标题" name="title">
    </div>
  </div>
  <div class="form-group">
    <label  class="col-sm-2 control-label">文章类别</label>
    <div class="col-sm-10">
      <select class="form-control" name="leibie">
      <option>－选择文章类别－</option>
      <option>Web前端</option>
      <option>后台开发</option>
      <option>架构设计</option>
      <option>UI</option>
      <option>项目需求</option>
    </select>
    </div>
  </div>
  <div class="form-group">
    <label for="author" class="col-sm-2 control-label">作者</label>
    <div class="col-sm-10">
      <input type="text" name="author" class="form-control" id="author" placeholder="作者">
    </div>
  </div>
  <div class="form-group">
    <label for="cover" class="col-sm-2 control-label">封面图</label>
    <div class="col-sm-10">
    <!-- <input> 标签的 type="file" 属性规定了应该把输入作为文件来处理。举例来说，当在浏览器中预览时，会看到输入框旁边有一个浏览按钮。 -->
     <input type="file"  name="fileUpload" />
    </div>
  </div>
   <div class="form-group">
    <label for="author" class="col-sm-2 control-label">博文简介</label>
    <div class="col-sm-10">
     <textarea class="form-control" rows="3" placeholder="输入博文简介" name="jianjie"></textarea>
    </div>
  </div>
  <div class="form-group">
    <label for="author" class="col-sm-2 control-label">博文内容</label>
    <div class="col-sm-10">
     <!-- 加载编辑器的容器 -->
    <script id="container" name="content" type="text/plain">

    </script>
    <!-- 配置文件 -->
    <script type="text/javascript" src="ueditor/ueditor.config.js"></script>
    <!-- 编辑器源码文件 -->
    <script type="text/javascript" src="ueditor/ueditor.all.js"></script>
    <!-- 实例化编辑器 -->
    <script type="text/javascript">
        var ue = UE.getEditor('container');
    </script>
    </div>
  </div>

  <div class="form-group">
    <div class="col-sm-2 col-sm-offset-6 ">
      <button type="submit" class="btn btn-primary">保存修改</button>
    </div>
  </div>
</form>


</body>

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 
</html>

写入数据库

点击发表博客后跳转到add.php,写入数据库

效果图

这里写图片描述

主要代码

add.php

<?php
header("Content-type:text/html;charset=utf-8");
// 保持格式的统一性
echo "<pre>"; 
// var_dump() 函数返回变量的数据类型和值
// 预定义的 $_POST 变量用于收集来自 method="post" 的表单中的值。
 var_dump($_POST);
 echo "</br>"; 
 // 通过使用 PHP 的全局数组 $_FILES，你可以从客户计算机向远程服务器上传文件。这里指的是图片
 var_dump($_FILES);
 // 通过年月日加随机数给图片命名
 $img=date("Ymn",time()).rand(100,999);
 // 移动位置
 move_uploaded_file($_FILES["fileUpload"]["tmp_name"], "./image/{$img}.png");
 // 获取内容
 $_POST['content']=htmlspecialchars($_POST['content']);
// 数据库
$servername = "";
$username = "";
$password = "";
$dbname = "";
// 创建连接
$conn = new mysqli($servername, $username, $password, $dbname);
// 检测连接
if ($conn->connect_error) {
    die("连接失败: " . $conn->connect_error);
} 
// 设置编码格式
$conn->query('set names utf8');
// sql语句
$sql = "insert into blog (title, leibie, author, cover,jianjie,content) values('{$_POST['title']}','{$_POST['leibie']}','{$_POST['author']}','./image/{$img}.png','{$_POST['jianjie']}','{$_POST['content']}')";
if ($conn->query($sql) === TRUE) {
    echo "新记录插入成功";
} else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}
// 跳转到列表页
header("location:http://localhost/blog/liebiao.php");
$conn->close();

列表页

写入数据库后跳转到列表页

效果图

这里写图片描述

主要代码

列表页代码：
liebiao.html

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<title>文章列表</title>
</head>

<body>
<div class="container">
<table class="table table-hover">
      <thead>
        <tr>
          <th>ID</th>
          <th>博文标题</th>
          <th>文章类别</th>
          <th>作者</th>
          <th>博文简介</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
      <!-- html代码中嵌套php -->
      <?php
       header("Content-type:text/html;charset=utf-8");
       //数据库
        $servername = "";
        $username = "";
        $password = "";
        $dbname = "";

        // 创建连接
        $conn = new mysqli($servername, $username, $password, $dbname);
        // Check connection
        if ($conn->connect_error) {
            die("连接失败: " . $conn->connect_error);
        } 

        // sql语句
        $sql = "SELECT * FROM blog";
        // 设置编码格式
        $conn->query('set names utf8');

        $result = $conn->query($sql);

        $data = array();

        if ($result->num_rows > 0) {

            while($row = $result->fetch_assoc()) {
                $data[] = $row;
            }
        } else {
            echo "0 结果";
        }
        $conn->close();

        // 获取数据库内容
        // 关联数组
        // <a href='bianji.php?id={$data[$i]['id']}'>编辑</a>跳转，并传一个参数
        // <a href='delete.php?id={$data[$i]['id']}'>删除</a>
        for($i=0;$i<count($data);$i++){
            echo "<tr><th scope='row'>{$data[$i]['id']}</th><td>{$data[$i]['title']}</td><td>{$data[$i]['leibie']}</td><td>{$data[$i]['author']}</td><td>{$data[$i]['jianjie']}</td><td><button type='button' class='btn btn-info'><a href='bianji.php?id={$data[$i]['id']}'>编辑</a></button> &nbsp;<button type='button' class='btn btn-danger'><a href='delete.php?id={$data[$i]['id']}'>删除</a></button></td></tr>";
        }
       ?>
      </tbody>
    </table>
</div>
</body>

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 
</html>

编辑页面

点击编辑就会跳转到编辑页面

效果图

这里写图片描述

主要代码

bianji.php

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<title>博客</title>
</head>

<body>
  <div class="container">
  <!-- 点击保存修改就会跳转到update.php,并更新数据库 -->
  <form class="form-horizontal" action="update.php" method="post" enctype="multipart/form-data">
  <!-- html代码中嵌套php代码 -->
  <?php
       header("Content-type:text/html;charset=utf-8");
       // 数据库
    $servername = "";
    $username = "";
    $password = "";
    $dbname = "";

    // 创建连接
    $conn = new mysqli($servername, $username, $password, $dbname);
    // Check connection
    if ($conn->connect_error) {
        die("连接失败: " . $conn->connect_error);
    } 

    // sql语句，获取接收到的id对应的内容
    $sql = "SELECT * FROM blog WHERE id={$_GET['id']}";
    // 设置编码格式
    $conn->query('set names utf8');

    $result = $conn->query($sql);

    $data = array();

    if ($result->num_rows > 0) {

        while($row = $result->fetch_assoc()) {
            $data[] = $row;
        }
    } else {
        echo "0 结果";
    }
    $conn->close();
    ?>
     <!-- 把获取的内容输出 -->
  <input type="hidden" value="<?php echo $data[0]['id']?>" name='id'>
  <div class="form-group">
    <label for="blogTitle" class="col-sm-2 control-label">博文标题</label>
    <div class="col-sm-10">
      <input type="text" value="<?php echo $data[0]['title']?>" class="form-control" id="blogTitle" placeholder="博文标题" name="title">
    </div>
  </div>
  <!-- 文章类别这个太麻烦了，就没有实现输出-->
  <div class="form-group">
    <label  class="col-sm-2 control-label">文章类别</label>
    <div class="col-sm-10">
      <select class="form-control" name="leibie" >
      <option>－选择文章类别－</option>
      <option>Web前端</option>
      <option>后台开发</option>
      <option>架构设计</option>
      <option>UI</option>
      <option>项目需求</option>
    </select>
    </div>
  </div>

  <div class="form-group">
    <label for="author" class="col-sm-2 control-label">作者</label>
    <div class="col-sm-10">
      <input type="text" value="<?php echo $data[0]['author']?>" name="author" class="form-control" id="author" placeholder="作者">
    </div>
  </div>
   <!-- 封面图这个太麻烦了，就没有实现输出-->
  <div class="form-group">
    <label for="cover" class="col-sm-2 control-label" >封面图</label>
    <div class="col-sm-10">
     <input type="file"  name="fileUpload" text="<?php echo $data[0]['cover']?>" />
    </div>
  </div>
   <div class="form-group">
    <label for="author" class="col-sm-2 control-label" >博文简介</label>
    <div class="col-sm-10">
     <textarea class="form-control" rows="3" placeholder="输入博文简介" name="jianjie" ><?php echo $data[0]['jianjie']?></textarea>
    </div>
  </div>
  <div class="form-group">
    <label for="author" class="col-sm-2 control-label">博文内容</label>
    <div class="col-sm-6">
     <!-- 加载编辑器的容器 -->
    <script id="container" name="content" type="text/plain">
    <?php echo htmlspecialchars_decode($data[0]['content'])?>
    </script>
    <!-- 配置文件 -->
    <script type="text/javascript" src="ueditor/ueditor.config.js"></script>
    <!-- 编辑器源码文件 -->
    <script type="text/javascript" src="ueditor/ueditor.all.js"></script>
    <!-- 实例化编辑器 -->
    <script type="text/javascript">
        var ue = UE.getEditor('container');
    </script>
    </div>
  </div>

  <div class="form-group">
    <div class="col-sm-offset-6 ">
      <button type="submit" class="btn btn-primary">保存修改</button>
    </div>
  </div>
</form>


</body>

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 
</html>

编辑功能（更新）

点击保存修改后会跳转到update.php,更新数据库后跳转到列表页

主要代码

liebiao.php

<?php
// 设置编码格式
header("content-type:text/html;charset=utf-8");
 // 数据库
    $servername = "";
    $username = "";
    $password = "";
    $dbname = "";

    // 创建连接
    $conn = new mysqli($servername, $username, $password, $dbname);
    // Check connection
    if ($conn->connect_error) {
        die("连接失败: " . $conn->connect_error);
    } 

// 设置编码格式
$con->query("set names utf8");
// 获取修改后的内容
$_POST['content']=htmlspecialchars($_POST['content']);
// 如果没有重新选择图片，则把封面图以外的信息更新到数据库
if($_FILES['fileUpload']['size']==0){
    mysqli_query($con,"UPDATE blog SET title='{$_POST['title']}',leibie='{$_POST['leibie']}',author='{$_POST['author']}',jianjie='{$_POST['jianjie']}',content='{$_POST['content']}' WHERE id={$_POST['id']}");


}

// 如果重新选择图片，则把新的封面图和其他信息更新到数据库

else{   
    $img=date("Ymn",time()).rand(100,999);
    move_uploaded_file($_FILES["fileUpload"]["tmp_name"], "./image/{$img}.png");
    mysqli_query($con,"UPDATE blog SET title={$_POST['title']},leibie={$_POST['leibie']},author={$_POST['author']},cover='./image/{$img}.png',jianjie={$_POST['jianjie']},content={$_POST['content']} WHERE id={$_POST['id']}");
header("location:http://localhost:8080/20170701php/liebiao.php");

}


// 输出提示信息
echo "修改成功 ";
// 跳转页面
// header("location:http://localhost/blog/liebiao.php");


mysqli_close($con);
?>

删除功能

点击删除按钮就会跳转到delete.php,删除成功后跳转到liebiao.php

主要代码

<?php
 // 数据库
    $servername = "";
    $username = "";
    $password = "";
    $dbname = "";

    // 创建连接
    $conn = new mysqli($servername, $username, $password, $dbname);
// 检测连接
if (mysqli_connect_errno())
{
    echo "连接失败: " . mysqli_connect_error();
}

//var_dump($_GET['id']);
mysqli_query($con,"DELETE FROM blog WHERE id={$_GET['id']}");
echo "删除成功" ;
    header("location:http://localhost/blog/liebiao.php");

mysqli_close($con);
?>

删除后的列表页
这里写图片描述

php博客小作业，这个过程中遇到了一些编码问题~~

向来缘浅奈何晴深

关注

6
点赞
踩
28

收藏

觉得还不错? 一键收藏
3
评论
php博客小作业

用php实现写博客，查看列表，编辑博客，删除博客的小功能，用了bootstrap框架，用了ueditor编辑器。主要代码如下：博客编辑页面效果图主要代码blog.html<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><link rel="stylesh
复制链接

扫一扫