本文介绍了如何风格“输入文件”与CSS3 / Javascript?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想使用CSS3风格< input type =file/>
。
I would like to style <input type="file" />
using CSS3.
或者,我希望用户按下 div
(即我将风格),这将打开浏览窗口。
Alternatively, I would like user to press on a div
(that I will style) and this will open the Browse window.
是否可以使用HTML,CSS3和Javascript / jQuery?
Is that possible to do that using HTML, CSS3, and Javascript / jQuery only ?
推荐答案
你可能想要一些想法...
I have this rough example that you might want to get some idea...
<div id="file">Chose file</div>
<input type="file" name="file" />
CSS
CSS
#file {
display:none;
}
jQuery
jQuery
var wrapper = $('<div/>').css({height:0,width:0,'overflow':'hidden'});
var fileInput = $(':file').wrap(wrapper);
fileInput.change(function(){
$this = $(this);
$('#file').text($this.val());
})
$('#file').click(function(){
fileInput.click();
}).show();
demo
这篇关于如何风格“输入文件”与CSS3 / Javascript?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!