小编use*_*758的帖子

Boostrap 4中的文件浏览器缺少文件名.它只是说选择文件...我为它制作了一个javascript解决方案.有没有更好的方法来解决它？

HTML

<label class="file">
    <input type="file" id="file1" >
    <span class="file-custom" data-content="Choose file..."></span>
</label>

jQuery的

$("input[type=file]").change(function(){
    var fieldVal = $(this).val();
    if (fieldVal != undefined || fieldVal != "") {   
        $(this).next(".file-custom").attr('data-content', fieldVal);
    }
});

CSS

.file-custom:after {
    content: attr(data-content);
}

唯一的区别是您必须向跨度添加数据内容.另一方面,它更容易改变语言.

链接到Bootstraps文件浏览器:http: //v4-alpha.getbootstrap.com/components/forms/#file-browser