我与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>