当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JavaScript实现动态增加文件域表单

Javascript
IE8 原生JSON支持
iframe 自适应高度[在IE6 IE7 FF下测试通过]
javascript 清除输入框中的数据
IE和FireFox(FF)中js和css的不同
JavaScript asp.net 获取当前超链接中的文本
用JavaScript页面不刷新时全选择,全删除(GridView)
JavaScript获取GridView选择的行内容
javaScript 读取和设置文档元素的样式属性
js select 控制实现代码
javascript 类方法定义还是有点区别
jQuery 绝对入门
网页开发中的容易忽略的问题 javascript HTML中的table
childNodes 用法两例
js 只能输入数字和小数点的文本框改进版
javascript 09年最新版的省市联动
jquery 实现的全选和反选
js 拖拽翻页实现代码
保证JavaScript和Asp、Php等后端程序间传值编码统一
JavaScript 无符号右移赋值操作
JavaScript 无符号右移运算符

Javascript 中的 JavaScript实现动态增加文件域表单


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 214 ::
收藏到网摘: n/a

对于上传多个文件,可以通过js来动态生成文件域,下面是源代码,收藏在这里,供以后直接使用,hoho! js代码:
复制代码 代码如下:

<script language="javascript">
//全局变量,代表文件域的个数,并用该变量区分文件域的name属性
var file_count = 0;
//增加文件 域
function additem(id) {
if (file_count > 9) {
alert("最u22810 10个u25991 件u22495 ");
return;
}
//定义行变量row;单元格变量cell;单元格内容变量str。
var row,cell,str;
//在指定id的table中插入一行
row = eval("document.all["+'"'+id+'"'+"]").insertRow();
if(row != null ) {
//设置行的背景颜色
row.bgColor="white";
//在行中插入单元格
cell = row.insertCell();
//设置str的值,包括一个文件域和一个删除按钮
str='<input onselectstart="return false" class="tf" onpaste="return false" type="file" name="file[' + file_count + ']" style="width:500px" onkeydown="return false;"/>';
str += " <input type="+'"'+"button"+'"'+" value="+'"'+"删除"+'"'+" onclick='deleteitem(this,"+'"'+"tb"+'"'+");'>";
//文件域个数增加
file_count++;
//设置单元格的innerHTML为str的内容
cell.innerHTML=str;
}
}
//删除文件域
function deleteitem(obj,id) {
var rowNum,curRow;
curRow = obj.parentNode.parentNode;
rowNum = eval("document.all."+id).rows.length - 1;
eval("document.all["+'"'+id+'"'+"]").deleteRow(curRow.rowIndex);
file_count--;
}
</script>

html代码:
复制代码 代码如下:

<input type=button value="增加" onclick='additem("tb")'/><br/>
<table cellspacing="0" id="tb" style="width:400px">
</table>