Question

正如tittle所说的那样，是否可以设置<input type="file">的样式，只显示"Upload"之类的文本而不显示按钮和目标文件：）

我已经尝试谷歌但所有的答案都没有削减它，唯一的答案接近我想要的是javascript div触发器将触发。（点击）输入<input type="file">但作为有人指出，浏览器/手机会将此视为“攻击”而不会允许$ _POST！

Answer 1

检查此CustomInputFile使用Bootstrap更容易定制。

Answer 2

你可以通过模拟输入元素并将事件监听器绑定到div或者你想要使用的任何东西来做到这一点：

HTML：

<form>
    <input type="file" id="upload"/>
    <div id="button">Upload</div>
</form>

CSS：

#upload{
  display: none; 
}

#button{ 
  display: inline-block;
  cursor: pointer;
}

JavaScript的：

document.getElementById("button").addEventListener("click", function(){
  document.getElementById("upload").click();
});