Jasny上传图像预览插件时，现有的图像是空的

jasny upload image preview plugin when existing image is empty

本文关键字：图像 插件 Jasny      更新时间：2023-09-26

我使用jasny upload image preview plugin for bootstrap 3，但是当预览图像为空时，这不起作用。我只需要显示no+image和select image按钮，而不是empty div和change / remove按钮。

HTML: 

<div class="fileinput fileinput-exists" data-provides="fileinput" data-name="myimage">
    <input type="hidden" name="myimage" value="1" />
    <div class="fileinput-new thumbnail" style="width: 200px; height: 150px;">
        <img src="http://www.placehold.it/200x150/EFEFEF/AAAAAA&text=no+image" />
    </div>
    <div class="fileinput-preview fileupload-exists thumbnail" style="max-width: 200px; max-height: 150px; line-height: 20px;">
    </div>
    <div> <span class="btn btn-default btn-file"><span class="fileinput-new">Select image</span><span class="fileinput-exists">Change</span>
        <input type="file" />
        </span> <a href="#" class="btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>
    </div>
</div>

如何解决这个问题?

演示:http://jsfiddle.net/Sambora/Y7hGh/2/

如果我正确理解你的问题，我认为这是因为你使用fileupload-exists而不是fileinput-exists。所以预览容器的标记应该是这样的:

<div class="fileinput-preview fileinput-exists thumbnail" 
     style="max-width: 200px; max-height: 150px; line-height: 20px;">
</div>

在没有提供预览图像的情况下，您需要将代码的第一行中的:fileinput-exists更改为fileinput-new。

<div class="fileinput fileinput-exists" data-provides="fileinput" data-name="myimage">

: 

<div class="fileinput fileinput-new" data-provides="fileinput" data-name="myimage">
相关文章：