为什么图片在刷新页面上重复?

时间:2017-12-25 10:59:02

标签: php sql

我正在尝试使图像显示永久清爽。 图像应该是不变的。我们可以永久添加图片和文字,我们可以添加更多帖子。

  

一个名为image_upload的数据库,创建一个名为images的表,其中包含字段:

     

id - int(11)

     

image - varchar(100)

     

image_text - text

的index.php

 <?php
  // Create database connection
 $db = mysqli_connect("localhost", "root", "", "image_upload");

      // Initialize message variable
      $msg = "";

    // If upload button is clicked ...
    if (isset($_POST['upload'])) {
        // Get image name
        $image = $_FILES['image']['name'];
        // Get text
        $image_text = mysqli_real_escape_string($db, $_POST['image_text']);

        // image file directory
    $target = "images/".basename($image);

    $sql = "INSERT INTO images (image, image_text) VALUES ('$image', '$image_text')";
        // execute query
        mysqli_query($db, $sql);

        if (move_uploaded_file($_FILES['image']['tmp_name'], $target)) {
            $msg = "Image uploaded successfully";
        }else{
            $msg = "Failed to upload image";
        }
    }
    $result = mysqli_query($db, "SELECT * FROM images");
    ?>
    <!DOCTYPE html>
    <html>
    <head>
    <title>Image Upload</title>
    <style type="text/css">
        #content{
          width: 50%;
        margin: 20px auto;
        border: 1px solid #cbcbcb;
       }
       form{
        width: 50%;
        margin: 20px auto;
       }
       form div{
        margin-top: 5px;
       }
       #img_div{
        width: 80%;
        padding: 5px;
        margin: 15px auto;
        border: 1px solid #cbcbcb;
       }
       #img_div:after{
        content: "";
        display: block;
        clear: both;
       }
       img{
        float: left;
        margin: 5px;
        width: 300px;
        height: 140px;
       }
    </style>
    </head>
    <body>
    <div id="content">
      <?php
      while ($row = mysqli_fetch_array($result)) {
        echo "<div id='img_div'>";
            echo "<img src='images/".$row['image']."' >";
            echo "<p>".$row['image_text']."</p>";
        echo "</div>";
      }
    ?>
      <form method="POST" action="index.php" enctype="multipart/form-data">
        <input type="hidden" name="size" value="1000000">
        <div>
          <input type="file" name="image">
        </div>
        <div>
          <textarea 
            id="text" 
            cols="40" 
            rows="4" 
            name="image_text" 
            placeholder="Say something about this image..."></textarea>
        </div>
        <div>
            <button type="submit" name="upload">POST</button>
        </div>
      </form>
    </div>
    </body>
    </html>

帮帮我如何解决这个问题。我创建了数据库并上传了图像和文本。同时刷新页面。帖子在之后和之后重复。

2 个答案:

答案 0 :(得分:0)

它现在有效。测试。两个多小时后,我很困惑为什么在成功上传后页面无法重定向。撤消页面顶部的一些缩进解决了这个问题。

 <?php
 session_start();

 // Create database connection
 $db = mysqli_connect("localhost", "root", "", "image_upload");

 if(isset($_POST['image_text'])){

    // Get text
    $image_text = mysqli_real_escape_string($db, $_POST['image_text']);     

 }

 if(isset($_FILES['image'])){
    // Get image name
    $image = $_FILES['image']['name'];
    $tempath = $_FILES['image']['tmp_name'];     
 }

 // If upload button is clicked ...
 if(isset($_POST['upload'])){

     if(isset($image) && isset($tempath) && !empty($image)){

         $image = time()."_".$image;
         $image_folder = "images/";

         if(is_uploaded_file($tempath)){ 

             if(move_uploaded_file($tempath, $image_folder.$image)) {

                 $image_uploaded = true;    

                 }

            }
        }else{

            $msg = "Failed to upload image";

        }


     if(isset($image_uploaded) && ($image_uploaded == true)){

            $sql = "INSERT INTO images (image, image_text) VALUES('$image', '$image_text')";
            // execute query
            mysqli_query($db, $sql);

            $sent = true;

            $_SESSION['sent'] = "Image uploaded successfully";

        }
    }


    if(isset($sent) && ($sent == true)){

            header("Location: index.php");
            exit();

    }


  $result = mysqli_query($db, "SELECT * FROM images");

?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Image Upload</title>

<style type="text/css">
    #content{
      width: 50%;
    margin: 20px auto;
    border: 1px solid #cbcbcb;
   }
   form{
    width: 50%;
    margin: 20px auto;
   }
   form div{
    margin-top: 5px;
   }
   #img_div{
    width: 80%;
    padding: 5px;
    margin: 15px auto;
    border: 1px solid #cbcbcb;
   }
   #img_div:after{
    content: "";
    display: block;
    clear: both;
   }
   img{
    float: left;
    margin: 5px;
    width: 300px;
    height: 140px;
   }
</style>
</head>
<body>
<div id="content">
  <?php
    if(isset($_SESSION['sent'])){

     echo "<p style='color:#006400;font-weight:bold;'>" . $_SESSION['sent'] . "</p>";
     unset($_SESSION["sent"]);      

    }

    if(isset($msg)){

    echo "<p style='color:#ff0000;font-weight:bold;'>" . $msg . "</p>";

    }

  if(mysqli_num_rows($result) > 0){

     while($row = mysqli_fetch_array($result)){
        echo "<div id='img_div'>";
        echo "<img src='images/".$row['image']."' >";
        echo "<p>".$row['image_text']."</p>";
        echo "</div>";
     }

  }else{

         echo "<h4>No data has been uploaded</h4>";

  }
?>
  <form method="POST" action="index.php" enctype="multipart/form-data">
    <input type="hidden" name="size" value="1000000">
    <div>
      <input type="file" name="image">
    </div>
    <div>
      <textarea 
        id="text" 
        cols="40" 
        rows="4" 
        name="image_text" 
        placeholder="Say something about this image..."></textarea>
    </div>
    <div>
        <button type="submit" name="upload">POST</button>
    </div>
  </form>
</div>
</body>
</html>

答案 1 :(得分:0)

希望以下内容将提供指导〜完全正常工作,但用于存储图像的路径与我的笔记本电脑相关,因此您需要稍微编辑该部分。

<div my-dir="myObj"></div>