上传文件前台jsp

Caraly

浏览: 89269 次
性别:

最近访客更多访客>>

xiaoweishu

zzy_001

littlebliss

javacky

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

jsp-uploadFile

a链接打开上传窗口

方法一：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>测试</title>

<style type="text/css">
.file {
	font: 10pt;
	color: black;
}
</style>

<script language="javascript">

var i=0;

      function addFile() {

       i++;

     currRow=conditionTable.insertRow();

     cellc=currRow.insertCell();

     cellcContext= "<input type='file' NAME='file("+(i-1)+")'>&nbsp;&nbsp;<button onclick='removeFile();'>删除</button><br>";

     cellc.innerHTML=cellcContext;

     //alert(cellcContext);

    }

function findTD(o){

if (o.nodeName=="TR"||o.nodeName=="TABLE") return;

if(o.nodeName=="TD")

return (o);

else

return (o.parentElement);

}

function removeFile(){

  o = findTD(event.srcElement);

  //alert(o.parentElement.rowIndex*1);

conditionTable.deleteRow(o.parentElement.rowIndex*1);

}

      function uploadFile(){            

          document.form1.action="uploadAction.do";  

          document.form1.submit();

      }

</script>

</head>

<body>

<form enctype="multipart/form-data" name="form1" method="post">

<div id="fileDiv"
	style='top: 150px; left: 0px; overflow-x: auto; overflow-y: auto; border-style: outset; border-width: 1pt; border-color: black;'>

<table id=conditionTable border=1>

</table>

<a href="javascript:void(addFile());" class="file">添加附件</a> <a
	href="javascript:void(uploadFile());" class="file">上传附件</a></div>

</form>
</body>
</html>

方法二：

<input type="button" value="继续添加" onclick="append();" />
<div id="div1"><input type="file" name="file1">
<div><script language="javascript">
var index=1;
function append()
{
var div =document.getElementById("div1");
var file=document.createElement("input");
file.setAttribute("type","file");
index++;
var name=file+index;
file.setAttribute("name",name);
div.appendChild(file);

var br=document.createElement("br");//换行
div.appendChild(br);
}
</script>

方法三：
（利用css样式，直接打开文件窗口）

<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;">ClickMe</a>
</div>
</div>

方法四：
（利用js，直接打开文件窗口）

<script language="javascript">      
function sDialog() {           
   var dataForm = document.forms['dataForm'];          
   dataForm.uploadFile.click();      
}
</script>
<form name="dataForm" enctype="multipart/form-data"><input
	name="uploadFile" type="file" style="display: none;"> <a
	href="javascript:void(sDialog());">选择文件</a></form>

推荐下开的淘宝小店筱夜宫主（http://xiaoyegongzhu.taobao.com/）DR.HU 胡博士美妆~坐在电脑旁的汉子姑娘注意脸部护理呀，做了程序媛，也要美丽啊。。。小店有优惠码：YE4450，报优惠码，抵两元券，(⊙o⊙)…

分享到：