Input file style, document PATH, filename acquisition

http://blog.csdn.net/comikey/article/details/8954479 solution is to put input on the top of the text, make transparent, so in the point of text, the actual click on input, so that the implementation of the file upload. Isn't it simple? Specific code: <style> #uploadImg {font-size:12px; overflow:hidden; Position:absolute} #file {position:absolute; z-index : 100; margin-left:-180px; Font-size:60px;opacity:0;filter:alpha (opacity=0); margin-top:-5px;} </style> <span id= "uploadimg" ><input type= "file" id= "file" size= "1" ><a href= "#" > Upload image </a > </span> so you can change the style to a picture, or a text with a background ... And so on how to change how to change. and also compatible with Ie6/ie7/firefox

1 <Liclass= "F_input"><spanclass= "T">Upload your CV:</span>2    <spanID= "Uploadimg">3       <inputtype= "File"ID= "File"size= "1" >4         <ahref="#">Click to upload your CV</a> 5    </span>6    <PID= "em">File not uploaded</P>7 </Li>

1 . sq_list li.f_input #em{Margin-left:195px;Line-height:32px;Color:#666;font-size:13px;}2 #uploadImg{cursor:Pointer;Overflow:Hidden;position:relative;width:104px;Height:32px;}3 #file{cursor:Pointer;position:Absolute;Z-index: -; Left:0;Top:0;width:104px;Height:32px;Opacity:0;Filter:Alpha (opacity=0);}4 #uploadImg a{cursor:Pointer;background:#0e2d43;position:Absolute;Top:0; Left:0;Display:Block;width:104px;Height:32px;text-align:Center;Line-height:32px;Color: White;font-size:14px;Font-weight:Normal;}

Pass-Through---Full path acquisition of file names

$ (' #file '). Change (function() {    $ (' #em '). Text ($ (' #file '). Val ());});

The file name is passed---get only the file name

1 var file = $ (' #file '),2     aim = $ (' #em '); 3     function (e) {4         // E.currenttarget.files is an array, and if multiple files are supported, you need to traverse 5         var name = E.currenttarget.files[0].name; 6         Aim.text (name); 7     });

Input file style, document PATH, filename acquisition