使用contact form7插件预览上传图片

【问题标题】：Preview upload image using contact form7 plugin使用contact form7插件预览上传图片
【发布时间】：2021-09-30 21:17:29
【问题描述】：

在我的联系表格 7 中，我上传了一张图片。我需要在提交之前预览这张图片。你能帮助我吗？最好的问候

【问题讨论】：

这能回答你的问题吗？ Previewing Image on Contact Form 7 另见：CF7 file upload image

标签： javascript forms image contact-form-7

【解决方案1】：

感谢 Erik，我找到了解决方案。如果其他用户有同样的问题，我在这里分享代码：

[file fileuploader filetypes:jpg id:uploader]
<img id="preview" src="#" />
<script>
var uploader = document.getElementById('uploader');
uploader.addEventListener('change', (event) => {
  var binaryData = [];
  binaryData.push(document.getElementById('uploader').files);
  if (binaryData) preview.src = window.URL.createObjectURL(binaryData[0][0]);
});
</script>

【讨论】：