1 <input type="text" name="textfield" value="{$data.litpic}" id="textfield" class="txt" / > 2 <input type="button" class="btn" value="浏览"> 3 <input type="file" name="litpic" value="" class="addLitpic" size="28" onChange="document.getElementById('textfield').value=this.value"/>
1 .txt{ 2 height:22px; 3 width:180px; 4 border:1px solid #cdcdcd; 5 } 6 .btn{ 7 width:70px; 8 height:24px; 9 border:1px solid #cdcdcd; 10 background:#FFF; 11 } 12 .addLitpic{ 13 height:24px; 14 width:260px; 15 position:absolute; 16 top:196px; 17 left:39px; 18 filter:alpha(opacity:0); 19 opacity:0; 20 }
将type="file"部分覆盖到type="text"表层,然后用filter:alpha(opacity:0); opacity:0;将表层设置成透明即可。
锁解决问题:
1.在框内可以显示value值;
2.可以美化界面;
3.只显示文件名,不显示c:\.....这样的路径。
如图: