Html 输入类型="；文件"；隐藏输入并保留按钮？

是否有人知道如何将输入隐藏在

input type=“file”

中并保留按钮

---

这可能吗？

从历史上看，文件输入一直是HTML样式设计中的一个难题。不过，有一些解决办法。看看是什么用一些自定义元素遮挡了输入。设置这些元素的样式和自定义要容易得多

---

这也是一篇关于这个主题的好文章。

恐怕这是不可能的。下面是为隐藏原始字段的字段设置样式，并用一些标准输入替换它，然后使用javascript反映原始字段。

使用clip属性。需要绝对定位，因此添加相对定位的容器

input[type="file"] { outline: none; cursor: pointer; position: absolute; top:0; clip: rect(0px 222px 22px 145px);  }

Webkit浏览器需要不同的坐标：

* > /**/ input[type="file"], x:-webkit-any-link { outline: none; cursor: pointer; position: absolute; top:0; clip: rect(0px 86px 22px 0px);  }

$（函数（）{
$（“#btn上载”）。单击（函数（e）{
e、 预防默认值（）；
$（“#文件”）。单击（）；
});
});
#文件{显示：无；}
形象

<script type="text/javascript">
    $(function () {
        $('#btn-upload').click(function (e) {
            e.preventDefault();
            $('#file').click();
        });
    });
</script>

<style type="text/css">
    #file { display:none; } 
</style>

<div>
    <input type="file" id="file" name="file" />
    <button type="button" id="btn-upload">Image</button>
</div>