Question

这是上传文件代码：

<form>
<input type="file" name="file"/>
</form>

它显示一个文本框和BROWSE按钮来上传文件。

嗯，但是有没有办法只需点击“部分”文本上传文件，例如：“上传你的文件”文本。点击此文本后，将出现上传框。

Answer 1

试试这个

http://jsfiddle.net/RffbE/

<form>
<input type="file" name="file" id="file" style="display:none"/>
<span onclick="doTrick()">Upload your file</span>
</form>

并使用此javascript函数。

function doTrick() {
    document.getElementById('file').click();
}

Answer 2

我想你需要这个

请看我的jsfiddle

jsfiddle：http://jsfiddle.net/ks5r7/6/

    <html>
    <head>
        <script>
            function show()
            {
                document.getElementById('box').style.display='inline';
            }

        </script>
    </head>
    <body>
        <div id="show"><a href="#" onclick="show()">Upload my file</div>

        <div id="box" style="display:none";><input type="file"/></div>
    </body>
</html>

您可以在此设置每个元素的样式

Answer 3

直接你不能在输入类型文件上设置任何css，你需要使用技巧。请参阅此plugin

Html / CSS上传文件

3 个答案: