javascript - 当现有图像为空时，jasny 上传图像预览插件

Question

我使用用于 bootstrap 3 的 jasny 上传图像预览插件但是当预览图像为空时这不起作用。我只需要显示 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/

Answer 1

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

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