Javascript 我如何才能删除“删除”；“未选择任何文件”；在Chrome中输入文件的工具提示？

我想从Google Chrome中输入的文件中删除“No file Selected”工具提示（我看到Firefox中没有显示工具提示）

请注意，我说的不是输入字段中的文本，而是当您将鼠标移到输入上时出现的工具提示

我试过这个，但运气不好：

$('#myFileInput').attr('title', '');

---

这是webkit浏览器的本机部分，您无法将其删除。您应该考虑一个黑客解决方案，比如覆盖或隐藏文件输入

黑客解决方案：

input[type='file'] {
  opacity:0    
}

---

要实现这一点，您需要大量定制控件

---

请按照以下指南操作：

给

-webkit外观：

一次尝试。无论如何，值得一试

---

希望这有帮助：）

直接输入[type=file]时，您不能对进行太多修改。

使输入类型文件不透明度为0，并尝试使用自定义CSS在其上放置相对元素[div/span/button]

试试这个

---

您可以为yor元素设置一个宽度，它将只显示按钮并隐藏“未选择文件”。

这是一个棘手的问题。我找不到选择“no file selected”元素的方法，因此我使用：after伪选择器创建了一个掩码

我的解决方案还需要使用以下伪选择器来设置按钮的样式：

::-webkit-file-upload-button

试试这个：

仅供参考：这只适用于webkit浏览器

---

注：如果有人知道如何在webkit inspector中查看像上面那样的webkit伪选择器，请让我知道

，我只是希望文本不可见，并且仍然使用本机浏览器按钮

input[type='file'] {
  color: transparent;
}

---

我喜欢undefined的所有建议，但我有一个不同的用例，希望这对处于相同情况下的人有所帮助。

我想找到一个很好的答案。。。我发现：

首先删除“未选择文件”

input[type="file"]{
font-size: 0px;
}

然后将按钮与

-webkit文件上载按钮一起使用，方法如下：

input[type="file"]::-webkit-file-input-button{
font-size: 16px; /*normal size*/
}

希望这就是你想要的，它对我有用。
你可以禁用工具提示，在像Chrome这样的webkit浏览器上设置一个带有空格的标题，在Firefox或IE上设置一个空字符串（在Chrome 35、FF 29、IE 11、safari mobile上测试）

结合上面的一些建议，使用jQuery，下面是我所做的：

input[type='file'].unused {
  color: transparent;
}

以及：

并将类“unused”放在文件输入上。这很简单，而且效果很好。
适用于所有浏览器，而且很简单。这是为我做的


$（函数（）{
$（'input[type=“file”]”）。更改（函数（）{
if（$（this.val（）！=“”）{
$（this.css（'color'，'#333'）；
}否则{
$（this.css（'color'，'transparent'）；
}
});
})
input[type=“file”]{
颜色：透明；
}
可以使用title属性编辑默认工具提示

<input type='file' title="your text" />



但是如果您试图删除此工具提示

<input type='file' title=""/>



这行不通。下面是我的小技巧，请用空格尝试标题。它会起作用的。：）

这里的所有答案都过于复杂，或者完全错误

html:


选择文件

css:

输入{
显示：无；
}

javascript:

$（'button'）。在（'click'，function（）上{
$（'input'）。触发器（'click'）；
});


我以最简单的方式创作了这把小提琴。单击选择文件按钮将打开文件选择菜单。然后，您可以根据需要对按钮进行样式化。基本上，您只需隐藏文件输入，并在单击另一个按钮时触发对其的合成单击。我在IE 9、FF和Chrome上对此进行了现场测试，它们都运行良好。
对我来说，最好的解决方案是将输入[type=“file”]包装在包装器中，并添加一些jquery代码：


$（函数（）{
函数readURL（输入）{
if（input.files&&input.files[0]）{
var reader=new FileReader（）；
reader.onload=函数（e）{
$（'#uploadImage'）.attr（'src'，e.target.result）；
}
reader.readAsDataURL（input.files[0]）；
}
}
$（“#图像”）.change（函数（）{
readURL（this）；
});
});
#图像{
位置：绝对位置；
排名：0；
左：0；
不透明度：0；
宽度：75px；
高度：35px；
}
#上传图像{
位置：相对位置；
顶部：30px；
左：70像素；
}
.按钮{
位置：相对位置；
宽度：75px；
高度：35px；
边框：1px实心#000；
边界半径：5px；
字号：1.5em；
文本对齐：居中；
线高：34px；
}

上传
这一款适合我（至少在Chrome和Firefox中）：

最好避免使用不必要的javascript。可以利用标签标记展开输入的单击目标，如下所示：

<label>
  <input type="file" style="display: none;">
  <a>Open</a>
</label>


打开

即使输入是隐藏的，链接仍然可以作为它的点击目标，你可以根据自己的需要设置样式。
非常简单，忘记CSS定位输入[“type”]的事情吧，它对我不起作用。我不知道为什么。我在HTML标签中找到了解决方案

<input type="file" style="color:transparent; width:70px;"/>



问题结束
用包裹并使其不可见。
在Chrome、Safari和FF中工作


标签{
填充物：5px；
背景：银；
}
标签>输入[类型=文件]{
显示：无；
}

选择文件
我想出了一个黑客解决方案，它完全删除了“未选择文件”以及在该文本之后添加的额外空间（在Chrome中，我得到了如下内容：
“未选择任何文件”）

这完全打乱了我的页面对齐方式，所以我真的与之斗争以找到解决方案。在输入标记的样式属性中，将“宽度”设置为按钮的宽度将消除尾随文本和空格。由于按钮的宽度在所有浏览器中都不相同（例如在Firefox中稍小），因此您还需要设置样式
<input type='file' title="your text" />

<input type='file' title=""/>

<input type='file' title=" "/>

<input type="file" accept="image/*" title="&nbsp;"/>

<label>
  <input type="file" style="display: none;">
  <a>Open</a>
</label>

<input type="file" style="color:transparent; width:70px;"/>

<input style="float:left; **width:88px;** **color:#000000;**" type="file" id="fileInput" onclick="fileOpen()">    

<input type="file" value="" title=" " />

input[type="file"]{
  font-size: 0px;
}

$("input[type=file]").mouseover(function(event) {
    event.preventDefault();
    // This will disable the default behavior of browser
 });