Como posso excluir imagens especificadas de uma visualização？

编程问答 2022-05-20

问题描述

目前，我有一个文件条目，显示用户上传的图像的预览。我想知道如何在代码中实现一些可以从可视化中删除图像的东西。像图像附近或内部的 X 之类的东西，以便您可以将其删除。我查看了一些地方，我发现的只是一个使图像不可见的类添加。你有删除特定图像的功能方法吗？

.gallery {
  width: 100%;
  max-height: inherit;
  border-radius: 10px;
  display: block;
  overflow: auto;
}

.gallery>img {
  width: 100px;
  max-height: 100px;
  object-fit: cover;
  border-radius: 10px;
  position: relative;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form action="Post" class="header-base">
  <script type="text/javascript">
    $(function() {
      // Multiple images preview in browser
      var imagesPreview = function(input,placetoInsertimagePreview) {

        if (input.files) {
          var filesAmount = input.files.length;

          for (i = 0; i < filesAmount; i++) {
            var reader = new FileReader();

            reader.onload = function(event) {
              $($.parseHTML('<img class="imgsdss">')).attr('src',event.target.result).appendTo(placetoInsertimagePreview);

            }

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

      };

      $('#gallery-photo-add').on('change',function() {
        imagesPreview(this,'div.gallery');
      });


    });
  </script>

  <center>

    <div class="gallery" id="gelss"></div>

  </center>

  <div class="gll">

    <input type="file" name="file" multiple id="gallery-photo-add" accept="image/*" class="arqv">

  </div>


</form>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

htmljavascriptjquerypreviewpreview