<input type="file" value="Browse" name="avatar" id="id_avatar" />
我试图修改该值,但它不起作用。如何自定义按钮文本?
<input type="file" value="Browse" name="avatar" id="id_avatar" />
我试图修改该值,但它不起作用。如何自定义按钮文本?
当前回答
我认为这就是你想要的:
<button style="display:block;width:120px; height:30px;" onclick="document.getElementById('getFile').click()">Your text here</button>
<input type='file' id="getFile" style="display:none">
其他回答
<input id="uploadFile" placeholder="Choose File" disabled="disabled" />
<div class="fileUpload btn btn-primary">
<span>Your name</span>
<input id="uploadBtn" type="file" class="upload" />
</div>
JS
document.getElementById("uploadBtn").onchange = function () {
document.getElementById("uploadFile").value = this.value;
};
更多的http://geniuscarrier.com/how-to-style-a-html-file-upload-button-in-pure-css/
你可以放一张图片,像这样做:
HTML:
<img src="/images/uploadButton.png" id="upfile1" style="cursor:pointer" />
<input type="file" id="file1" name="file1" style="display:none" />
JQuery:
$("#upfile1").click(function () {
$("#file1").trigger('click');
});
警告: 在IE9和IE10中,如果你通过javascript触发文件输入中的onClick,表单将被标记为“危险”,不能用javascript提交,不确定它是否可以传统地提交。
我认为这就是你想要的:
<button style="display:block;width:120px; height:30px;" onclick="document.getElementById('getFile').click()">Your text here</button>
<input type='file' id="getFile" style="display:none">
下面是一个用纯HTML和javascript“改变”文件类型输入文本的方法:
<input id='browse' type='file' style='width:0px'>
<button id='browser' onclick='browse.click()'>
*The text you want*
</button>
对我来说,它不工作自定义文本与bootstrap文件样式。它有助于按钮装饰,但文本是奇怪的改变,在与css摔跤之前,我尝试以下:
$( document ).ready(function() {
$('.buttonText').html('Seleccione ficheros');
});
bootstrap- filstyle使用名为buttontext的类将组件渲染为span,因此当文档加载时只需更改文本。很简单,它必须在所有浏览器上工作。
干杯