html - 样式化“选择文件”按钮

Question

有什么办法可以“屏蔽”“上传照片”按钮后面的“选择文件”按钮吗？所以当你点击漂亮的按钮时，它会打开文件浏览器？

谢谢

http://jsfiddle.net/rUdf2/4/

Answer 1

http://jsfiddle.net/rUdf2/6/

Essential part:

1. Add an ID (or whatever "mark" that works) to the <input type="file"> element;

2. Add display:none to div#upload-wrap so that the <input type="file"> is invisible;

3. Add onclick="document.getElementById('upload-field').click();" to the "upload a photo" button.

Answer 2

正如路人所说，你必须隐藏<input type="file">元素并使用 jquery（或 javascript）添加这个

$('#share-bottom button').click(function () {
        $('#upload-wrap-button').click();
    });

http://jsfiddle.net/XnXeh/