利用javascript使html的file不可手动输入文件路径，只可通过[浏览]按钮选择

<INPUT type=file>，不希望文件路径可以手输入，必须用[浏览]按钮，以下是我的解决方案

<input type=text name=f_file id=f_file size=60 disabled>

<input type="button" name="file_btn" id="file_btn" onmouseover="fclick(DATA)" value="浏览...">

<input name="DATA" type="file" style="position:absolute;filter:alpha(opacity=0);width:30px" id="DATA" onchange="f_file.value=this.value" hidefocus>

<script language="JavaScript">

<!--

function fclick(obj){

  var f = document.INPUT_FORM;

  os = getoffset(f.file_btn);

  with(obj){

    style.posTop=os[0]

    style.posLeft=os[1]-5

  }

}

function getoffset(e){

  var t=e.offsetTop;

  var l=e.offsetLeft;

  while(e=e.offsetParent) {

    t+=e.offsetTop;

    l+=e.offsetLeft;

  }

  var rec = new Array(1);

  rec[0] = t;

  rec[1] = l;

  return rec

}

//-->

</script>

实际上是把file变透明了，利用一个text和一个button组合成一个假象上面的代码还有个隐患，就是当form提交之后，转入下一页面时，如果再从下一页面返回次页面，即history.back()时，那个text中保留了最后填入的值，而被透明掉的file是没有保留值的，这样就存在不一致的问题，所以，在form提交的时候，别忘了加上f.f_file.value=""，这样从下一页面返回时，text中也是空白，就一致了。

 

失败经验：

在网上找到了下面一段代码

<input type="file" name="FILE" style="display:none">

<input type=text name=file_text size=60 disabled>

<input type=button onClick=" FILE .disabled=false;FILE.click();file_text.value=FILE.value; FILE .disabled=true;" value="浏览...">

但是file是disabled在提交之后，servlet是不能取得它的值的，等于白做。但如果不让file变成disabled，那么在按提交按钮的时候，表单不会提交，而是把FILE的内容清空了，很奇怪，具体原因没找到。