Rails Cocoon:如何预览图像

时间:2019-03-20 04:36:51

标签: javascript ruby-on-rails cocoon-gem

我与Cocoon开发了图片上传器。但是我在显示预览嵌套图像时遇到困难。

我想计算茧嵌套的每个项目。然后我想将每个数字添加到id。我该如何实现?或者,如果您还有其他想法,请告诉我。

<div class="nested-fields">
  <div class="input-file updateIcon">
    <div class="imgPreview">
      <%= f.file_field :product_image, type: "file", id: "imageFile", accept: "image/*" %>
    </div>
    <%= link_to_remove_association "Remove image", f %>
  </div>
</div>

<script data-turbolinks-eval="false">
  $("#imageFile").change(function() {
    if (!this.files.length) {
      return;
    }

    var file = $(this).prop("files")[0];
    var fr = new FileReader();
    $(".imgPreview").css("background-image", "none");
    fr.onload = function() {
      $(".imgPreview").css("background-image", "url(" + fr.result + ")");
    };
    fr.readAsDataURL(file);
    $(".imgPreview img").css("opacity", 0);
  });
</script>

0 个答案:

没有答案