预览上传的文件(图像） - preview uploaded file (image)

preview uploaded file (image)

本文关键字：图像文件 | 更新日期: 2023-09-27

我有一个文件已经使用 input type="file" （PHP）上传到服务器，我的问题是，如何在下载图像之前预览图像。我想在每个下载文件名链接上放置一个预览按钮。单击预览按钮，它将弹出并显示图像。

有谁知道预览图像的编码？谢谢

你可以使用一些javascript/jQuery：

    function readURL(input) {
        if (input.files) {
            for (var i = 0; i < input.files.length; i++) {
                if(input.files[i]) {
                    preview(input, i);  
                }
            }   
        }
    } 
function preview(input, i) {
    var reader = new FileReader();
    reader.onload = function (e) {
        $('#divID').html('<img src="'+e.target.result+'" alt="Image currently not accessible" />');
    };
    reader.readAsDataURL(input.files[i]);
}
    $('input[type=file]').on('change', function() {
        readURL(this);
    });

对于 HTML 部分：

<div id="divID"></div>

请注意，这使用大量大图像的资源。