动态多附件上传多附件动态上传

最新推荐文章于 2024-07-23 12:35:43 发布

qq_13854514

最新推荐文章于 2024-07-23 12:35:43 发布

阅读量705

点赞数

分类专栏： ASP 文章标签： javascript class border table file function

ASP 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<html><head>
    <style>
a.addfile {
background-image:url(http://p.mail.163.com/js31style/lib/0703131650/163blue/f1.gif);
background-repeat:no-repeat;
background-position:-823px -17px;
display:block;
float:left;
height:20px;
margin-top:-1px;
position:relative;
text-decoration:none;
top:0pt;
width:80px;
}
input.addfile {
/*left:-18px;*/
}
input.addfile {
cursor:pointer !important;
height:18px;
left:-13px;
filter:alpha(opacity=0);
position:absolute;
top:5px;
width:1px;
z-index: -1;
}
</style>
<script language="javascript" >
    var n=0;                 //初始化数组为0，之后随着化来变化
   var fileCount=1;         //总共输入了多少个有值的控件 File ,初始化为1
   var tempRow=0;           //动态表格的临时行
    var maxRows=0;           //动态表格的临时列
   var num = 1;             //file 控件数组下标,从1开始,默认显示一个所以那个是 0
    var fileCount=1;         //整个操作中,总共用了多少个 File 控件

    function addFile()
    {
var str = '<a href=#? _fcksavedurl="#?" class="addfile" id="a' + num +'"><input type="file" size="50" class="addfile" οnchange="addFile()" name="uploadFile[' + num + '].file" ' + '/>';//待插入的文件控件
var fileText;//得到文件控件的值
var ary;//分割文件,以'/'号
var fileTextValue;//取出最后的文件名
    fileText = document.all("uploadFile[" + n + "].file").value;
ary = fileText.split("//");
fileTextValue = ary[ary.length-1];
document.all("a" + n).style.display = "none";//将前一个 P 的子元素设为不可见

   //在前面一个 File 控件隐藏后,接着再在原来的位置上插入一个
   document.getElementById('MyFile').insertAdjacentHTML("beforeEnd",str);

//这里可以灵活处理
      tempRow=fileTable.rows.length-1;    //fileTable   就是那个动态的   table 的 ID 了
    maxRows=tempRow;
    tempRow=tempRow+1;
    var Rows=fileTable.rows;            //Rows 数组
    var newRow=fileTable.insertRow(fileTable.rows.length);    //插入新的一行
    var Cells=newRow.cells;                                   //Cells 数组
    for (i=0;i<3;i++)                                         //每行的2列数据,一列用来显示文件名,一列显示"删除"操作
    {
      var newCell=Rows(newRow.rowIndex).insertCell(Cells.length);
      newCell.align="center";
      switch (i)
      {
        case 0 : newCell.innerHTML="<td width='40%' align='left'><span id='"+n+"'></span></td>";break;
        case 1 : newCell.innerHTML="<td width='20%' align='left'><a href='javascript:delTableFileRow(/"" +tempRow+ "/",/"" + n + "/")'>删除</a></TD>"; break;
case 2 : newCell.innerHTML="<td width='40%' align='left'> </TD>"; break;
      }
    }
    maxRows+=1;
    document.getElementById(n).insertAdjacentText("beforeBegin",fileTextValue);
n++;
num++;
fileCount++;
    }

function delTableFileRow(rowNum,fileCount){
    if (fileTable.rows.length >rowNum){
      fileTable.deleteRow(rowNum); //删除当关行
    }else
    fileTable.deleteRow(fileTable.rows.length-1);
    document.all("MyFile").removeChild(document.all("a" + fileCount)); //从元素P上删除子结点 a 。（跟删除表格行同步）
    fileCount--;    //总数 -1
}
//http://blog.csdn.net/zhongbx/archive/2007/04/06/1553919.aspx
</script>
</head>
<body>
<form id="kkk" action="/KmZszbfj.do" enctype="multipart/form-data"method="POST">
<table width="900" height="10" border="0" align="center"
cellpadding="0" cellspacing="0" id='tableA'>
<tr>
<td height="27" align="center" bgcolor="#E2F0FE" class="time"><P id="MyFile">
<a href=#? class="addfile" id="a0">
<input type="file" class="addfile" οnchange="addFile()" size="1" name="uploadFile[0].file" value=""/>
</a>
</P></td>
<td height="79" align="center" colSpan="3" bgcolor="#E2F0FE" class="time">

</tr>
</table>
<P id="btnFile">
    <input type="button" name="btnAddFile" value="text html" οnclick="javascript:alert(MyFile.innerHTML);"/>
</P>
</form>
</body></html>

qq_13854514

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
动态多附件上传多附件动态上传

a.addfile {background-image:url(http://p.mail.163.com/js31style/lib/0703131650/163blue/f1.gif);background-repeat:no-repeat;background-position:-823px -17px;display:block;float:left;height:20px;mar
复制链接

扫一扫