如何删除上传按钮但保留标签？答案

【问题标题】：How do I remove the upload button but keep the label?如何删除上传按钮但保留标签？
【发布时间】：2016-01-04 11:47:45
【问题描述】：

我正在尝试这样做，以便当您单击页面的某个部分时，用户可以上传文件。现在，我已经做到了，所以按钮的不透明度为 0，但标签也消失了。我只希望标签存在，但按钮消失。

基本代码：http://pastebin.com/gWYVNPxK

【问题讨论】：

你能提供给我们你目前拥有的代码吗？
你在这里：pastebin.com/gWYVNPxK

标签： html file button upload label

【解决方案1】：

您可以通过使用display 而不是opacity 来做到这一点，并使用一点 jQuery 来使文本触发现在隐藏的按钮：

JSFiddle：https://jsfiddle.net/Hybridx24/qou099nj/

【讨论】：

谢谢，但是当我尝试使用您的代码添加附件时，我的文件名没有出现。你知道如何获取按钮的值吗？
再次检查我的链接，我对其进行了更多修改以输出文件名:)
这正是我想要的，再次感谢您！
没问题，很高兴能帮上忙！如果这是正确答案，请不要忘记按我答案左侧的复选标记 + 投票，以防其他人偶然发现，因为这将帮助他们找到最快的解决方案。

【解决方案2】：

您可以使用<div onclick=".."> 或<span onclick=".."> 而不是<button onclick=".."/>，其中span/div 将代表页面的可点击部分

【讨论】：

【解决方案3】：

$('#_uploadText').on('click', function() {
  $('#_inputFile').click();
})

$('#_inputFile').on('change', function() {
 var value = $("#_inputFile").val();
	$("#_fileName").html(value);
})

input {
 display: none
}

<div class="col-md-2">
	<input id="_inputFile" type="file" class="form-control">
	<small id="_uploadText"> Click or Drag an Attachment </small>
  <br>
  <span id="_fileName"></span>

使用额外的 jquery 更改输入文件的显示值

【讨论】：