如何更改“选择文件”或“浏览”按钮文本和“未选择文件”文本。例子：

Question

我有以下用于显示“浏览”或“选择文件”按钮的 HTML 代码：

 <input type="file" name="file" id="file">

原文由 Swati Systematix 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您创建一个带有按钮和跨度的 div：

 <div>
<input type="button" onclick="document.getElementById('fu').click()"
value="Click to select file" />
<span id="fileName"></span>
</div>

并将可见的 div 放在名为“fu”的文件上传上

<input type="file" id="fu" onchange="FileSelected()" style="width: 0;">

并添加此脚本：

 function FileSelected(e)
{
    file = document.getElementById('fu').files[document.getElementById('fu').files.length - 1];
    document.getElementById('fileName').innerHtml= file.name;
}

你还有另一个有用的东西，比如 file.type 和 file.size 可以显示。

原文由 Farzin Kanzi 发布，翻译遵循 CC BY-SA 3.0 许可协议