<input type="file" value="Browse" name="avatar" id="id_avatar" />
我试图修改该值,但它不起作用。如何自定义按钮文本?
<input type="file" value="Browse" name="avatar" id="id_avatar" />
我试图修改该值,但它不起作用。如何自定义按钮文本?
当前回答
“上传文件…”文本是浏览器预先定义的,不能更改。 解决这个问题的唯一方法是使用Flash或基于java的上传组件,比如swfupload。
其他回答
对我来说,它不工作自定义文本与bootstrap文件样式。它有助于按钮装饰,但文本是奇怪的改变,在与css摔跤之前,我尝试以下:
$( document ).ready(function() {
$('.buttonText').html('Seleccione ficheros');
});
bootstrap- filstyle使用名为buttontext的类将组件渲染为span,因此当文档加载时只需更改文本。很简单,它必须在所有浏览器上工作。
干杯
这是一个JQuery插件,用于更改输入文件元素的按钮文本。
示例HTML:
<input type="file" id="choose-file" />
JS示例:
$('#choose-file').inputFileText({
text: 'Select File'
});
结果:
只有CSS和bootstrap类
< =铁路”链接stylesheet " href = " https://cdn.jsdelivr.net/npm/bootstrap@4 6。0 /区/ css / min bootstrap。css”诚信=“sha384-B0vP5xmATw1 K9KRQjQERJvTumQW0nPEzvF6L - Z6nronJ3oUOFUFpCjEUQouq2 + l”crossorigin =“匿名”> <div class="col-md-4 inputting -group"> <输入类别=“form控制”类型=“文本”/> < div级= input-group-btn”> <标签for=“文件” <输入id=“文件”类型=“文件”/> < / div > < / div >
使用Bootstrap FileStyle,它用于样式化表单的文件字段。它是一个名为Twitter Bootstrap的基于jquery的组件库的插件
示例用法:
包括:
<script type="text/javascript" src="js/bootstrap-filestyle.min.js"> </script>
通过JavaScript:
$(":file").filestyle();
通过数据属性:
<input type="file" class="filestyle" data-classButton="btn btn-primary" data-input="false" data-classIcon="icon-plus" data-buttonText="Your label here.">
在<input type="file">之前,添加一个图像,并且<input style="position:absolute">,它将占据<input type="file">的空间 对file元素使用下面的CSS 位置:相对; 透明度:0; z - index: 99;