1、页面上放个隐藏的
<input type= “file” />
2、然后加上一个文本input(type=”text”)和一个按钮input(type=”button”)
3、点按钮的时候调用
<input type=file />
的click选择文件
4、在
<input type=file />
的onchange事件中把其值显示在文本input中
5、注意把文本input设置成只读的,防止出错
例1:
<form name=formen> <input type="file" name="picpath" id="picpath" style="display:none" onChange="document.formen.path.value=this.value"> <input name="path" readonly> <input type="button" value="Browse" onclick="document.formen.picpath.click()"> </form>
例2:
<style> input { border: 1px solid green; } div { width: 300px; position: relative; } p { float: left } .file { position: absolute; top: 20px; right: 300px; + top: 0; + right: 73px; width: 0px; height: 20px; filter: alpha(opacity = 0); -moz-opacity: 0; opacity: 0; } #txt { height: 20px; margin: 1px } #ii { width: 70px; height: 20px; margin-top: 2px; border: none; } </style> <div> <form method="post" action="" enctype="multipart/form-data"> <p> <input type="text" id="txt" name="txt" /> </p> <p> <input id="ii" type="image" src="uploads/200702/05_125319_index_search_02.gif" value="选择" /> </p> <p> <input type="file" onchange="txt.value=this.value" class="file" /> </p> </form> </div>