Bootstrap InputFile初始预览将图像显示为原始大小

Question

我正在使用Krajee Bootstrap FileInput。我正在使用initialPreview标签并且遇到以下问题：

1. 初始图像以原始图像尺寸显示，而不是缩略图尺寸
2. 无法删除初始图像。
3. 我使用了overwriteInitial和autoReplace，但是当我添加新图片时，初始图片仍然存在。我希望它覆盖初始图像，但它不会

这是我的剧本：

<script>
    $("#file-1").fileinput({
        initialPreview: [
            "<img src='/img/Tulips.jpg' class='file-preview-image' title='Desert'>"
        ],
        uploadUrl: "@Url.Action("upload","Home")", 
        uploadAsync: true,
        allowedFileExtensions: ['jpg', 'png', 'gif'],
        maxFilesNum: 1,
        allowedFileTypes: ['image'],
        overwriteInitial: true,
        autoReplace: true,
        showUpload: true,
        showCaption: true,
        showUploadedThumbs: true,
    });
</script>

Answer 1

可能在img标签中设置宽度大小？

<script>
$("#file-1").fileinput({
    initialPreview: [
        "<img src='/img/Tulips.jpg' class='file-preview-image' title='Desert' width='120' >"
    ],
    uploadUrl: "@Url.Action("upload","Home")", 
    uploadAsync: true,
    allowedFileExtensions: ['jpg', 'png', 'gif'],
    maxFilesNum: 1,
    allowedFileTypes: ['image'],
    overwriteInitial: true,
    autoReplace: true,
    showUpload: true,
    showCaption: true,
    showUploadedThumbs: true,
});