点击超链接弹出一个上传文件的窗口怎么做呢？

Question

最近要做一个领导信箱的功能？在点击添加附件的时候也可以像163邮箱那样，弹出来一个上传文件的窗口，不知道这个功能是怎么来实现的。希望各位GGJJDDMM们来看看这个问题！！！！！！！在下感激万分。

Answer 1

<input type=file name=x id=x style="display:none"><a href='' onclick="document.getElementById('x').click();return false;"

Answer 2

是不是笑他超链接不完整？还是已经选好的文件没有在页面上出现并可以删除啊？？
<input type=file name=x id=x style="display:none">  <a href='' onclick="document.getElementById('x').click();return false;" >哈哈</a>

Answer 3

楼主会做上传么？？？
如果会的话，先把上传的页面iframe进来。点击上传让这个iframe显示，楼主应该知道上传必须单独的form,并且enctype="multipart/form-data"，如果我做我会这样做：
比如：
<a href='javascript:showFileDialog();'>上传</a> 
<div style="display:none;position:absolute;left:300px;top:100px;" id="fileDialog">
<iframe src="上传文件的页面"></iframe>
</div>
<script>
function showFileDialog(){
  //实际效果还得加上一个遮罩层之类的，弹出的层的位置自己定
  document.getElementById("fileDialog").style.display = "block";
}最后别忘了在上传文件页面上传成功的地方，加上
parent.document.getElementById("fileDialog").style.display = "none";//parent指向的父窗体，让这个上传层隐藏

Answer 4

这个：http://www.51aspx.com/CV/163FileUpload/

Answer 5

谢谢楼上各位的经典回答，I know！thank you！

Answer 6

W3C处于安全性考虑，并没有为type为file的input空间指定onclick事件(IE不怎么按W3C标准办事儿)。
但是我们可以通过CSS技术来模拟这个功能，前提是你的浏览器支持半透明效果(opacity)
参考下面的链接：
http://www.quirksmode.org/dom/inputfile.html以下是给你的示例（Firefox, IE和Google Chrome下测试均通过）：<style>
div.fileinputs {
    position: relative;
    overflow: hidden;
    width: 70px;/* this width should be changed */
}div.fakefile {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
}input.file {
    position: relative;
    text-align: right;
    left: -132px;  /* this width should be changed */
    *left: -152px; /* this width should be changed */
    z-index: 2;
    -moz-opacity:0;
    filter:alpha(opacity: 0);
    opacity: 0;
}
</style>
<div class="fileinputs">
    <input type="file" class="file" />
    <div class="fakefile">
        <a href="" onclick="return false;">Click Me</>
    </div>
</div>

Answer 7

<input type=file name=x id=x style="display:none"> 
<input type="text" name="pa" id="pa">
<a href='' onclick="document.getElementById('x').click();document.getElementById('pa').value=document.getElementById('x').value;return false;">上传</a>

Answer 8

<input type=file name=x id=x style="display:none"> 
<input type="text" name="pa" id="pa">
<a href='' onclick="f()">上传</a><script type="text/javascript">
function f(){
  document.getElementById('x').click();
  document.getElementById('pa').value=document.getElementById('x').value;
  return false;
}
</script>
各位大侠上面这样写就不行，下面的可以，这是为什么呢？<input type=file name=x id=x style="display:none"> 
<input type="text" name="pa" id="pa"> 
<a href='' onclick="document.getElementById('x').click();document.getElementById('pa').value=document.getElementById('x').value;return false;">上传 </a>

Answer 9

ThankYou各位  我是看一楼后 解决了问题