是否可以在上传后和提交前在 fancybox 中显示图像

Question

form.html

<input type="file" name="img" onchange="previewFile(this)" >
<a href="#">Preview</a>

上传后我想在点击预览时在 fancybox 中显示它。我在现有图片上添加 fancybox 但如何在上传图片上添加？

对于我使用的现有图像，它有效

$("a.fancybox").fancybox();

Answer 1

图片预览可以使用img标签

var previewFile = function(event) {
    var output = document.getElementById('output');
    output.src = URL.createObjectURL(event.target.files[0]);
    };

 <input type="file" name="img" onchange="previewFile(event)" > <br>
   <a class="fancybox"><img id="output" alt="Preview Image" width="300" height="300"/></a>

是否可以在上传后和提交前在 fancybox 中显示图像

Is it possible to show image in fancybox after upload and before submit

html

javascript

jquery

fancybox