Question

这是我的问题，当我试图将图像更改为我的第二个数据时，它没有改变但是当我尝试第一个数据时它正在改变我不知道为什么它不能处理第二个数据。有人可以帮我这个吗？

这是我的图片和文件所在的表单。

更新这里是id为42的新闻图片，当我改变图像时，图像没有变化，但是ID为40的新闻正在改变。

这是我的整个代码。

  $stmt = mysqli_prepare($con, "SELECT * FROM news ORDER BY news_id");
  mysqli_stmt_execute($stmt);
  $result = mysqli_stmt_get_result($stmt);
  while($row = mysqli_fetch_array($result)){
  ?>
   <tr>
  <td><?php echo $row['news_id']; ?></td>
  <td><?php echo $row['news_title']; ?></td>
  <td><?php echo $row['news_date']; ?></td>
  <td><?php echo $row['news_content']; ?></td>
  <td><img style="height:150px; width:200px;" src="<?php echo $row['news_image']; ?>"  ></td>
  <td>

  <button class="btn btn-info" data-toggle="modal" data-target="#newsedit<?php echo $row['news_id'];?>"><span class="glyphicon glyphicon-edit"></span>  Edit</button>
  <a class='btn btn-danger delete-object' data-toggle="modal" data-target="#newsdelete<?php echo $row['news_id'];?>"><span class="glyphicon glyphicon-remove"></span> Delete</a>

  <div class="modal fade" id="newsdelete<?php echo $row['news_id'];?>" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
              <div class="modal-content">
                    <div class="modal-body">
                       Are you sure you want to delete this?
                            </div>
     <div class="modal-footer">
      <a class='btn btn-danger left-margin' href="delete.php?newsid=<?php echo $row['news_id'];?>" >Yes</a>
    <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
          </div>
           </div>
          </div>
          </div>

     <div id="newsedit<?php echo $row['news_id'];?>" class="modal fade" 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">&times;</button>
                                    <h4 class="modal-title" id="myModalLabel">Edit events</h4>
                                  </div>

                                 <div class="modal-body edit-content">
                                    <form method="POST" enctype="multipart/form-data" action ="edit2.php?newsid=<?=$row['news_id']?>">
                                          <div class="form-group">
                                            <label for="title">News Title</label>
                                            <input type="text" name="titles" class="form-control title" id="title" placeholder="News Title" value="<?php echo $row['news_title']; ?>">
                                          </div>

                                          <div class="form-group">
                                             <label for="date">Date</label>
                                             <input type="text" name="dates" class="form-control date" id="date" placeholder="Date" value="<?php echo $row['news_date']; ?>"s>
                                         </div>

                                         <div class="form-group">
                                            <label for="content">News Content</label>
                                            <textarea class="form-control content" name="contents" rows="5" id="content"><?php echo $row['news_content']; ?></textarea>
                                         </div>


                                         <img id="blah" name="newsimages" src="<?php echo $row['news_image']; ?>" width="200px" height="140px"/>
                                            <input id="image" name="image" class="fileupload" type="file" accept="image/*"/>

                                 </div>

                               <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                <button type="submit" class='btn btn-info left-margin'>Yes</a>
                                  </form>
                            </div>
                              </div>
                        </div>
                   </div>


                </td>
            </tr>
        <?php
        }
        ?>

这是用于在上传之前显示图像的js。

<script type="text/javascript">
    function readURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function (e) {
                $('#blah').attr('src', e.target.result);
            }

            reader.readAsDataURL(input.files[0]);
        }
    }

    $("#image").change(function(){
        readURL(this);
    });
    </script>

Answer 1

使用类似的东西：

function readURL(input) {
  if (input.files && input.files[0]) {
    var url = URL.createObjectURL(input.files[0]);

    $(input).siblings('img').attr('src', url);
  }
}

$(".fileupload").change(function() {
  readURL(this);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img name="newsimages" width="200px" height="140px"/>
<input name="image" class="fileupload" type="file" accept="image/*" />

不要在文档中使用重复的id！这会导致未定义的行为，并且通常会导致事情未按预期发生。最简单的解决方案是删除PHP循环中HTML中的任何id。

上传前无法显示图片

1 个答案: