我正在将bootstrap与Jasny fork一起使用。我正在设计一种用户可以上传图像的表单。我想隐藏表单的提交按钮,直到用户实际选择了图像为止。理想情况下,当用户从表单中删除文件时,提交按钮也应该消失。这是我第一次真正使用此 fork 。我该怎么办?
<div class="fileupload fileupload-new" data-provides="fileupload">
<div class="fileupload-new thumbnail" style="width: 114px; height: 64px;"><img src="http://www.placehold.it/114x64/EFEFEF/AAAAAA" /></div>
<div class="fileupload-preview fileupload-exists thumbnail" style="width: 114px; height: 64px;"></div>
<span class="btn btn-file"><span class="fileupload-new">Select image</span><span class="fileupload-exists">Change</span><input type="file" /></span>
<a href="#" class="btn fileupload-exists" data-dismiss="fileupload">Remove</a>
<button type="submit" class="btn btn-primary">Upload</button>
</div>
最佳答案
您必须将事件侦听器添加到输入字段并侦听更改事件。然后,您必须检查事件目标是否为用户选择的文件。我修改了您的代码以在输入字段中添加ID,然后在http://jsfiddle.net/LLfjE/上载按钮进行检查
$('#file-input').on('change', function(evt) {
var file = evt.target.files[0];
if (file){
$('#upload-btn').show();
} else {
$('#upload-btn').hide();
}
});