js添加删除附件
2015-06-27 12:22
621 查看
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Untitled Document</title>
<style type="text/css">
table a:link,table a:visited{
color:#179ed9;
text-decoration:none;
}
table a:hover{
color:#f36021;
}
</style>
<script type="text/javascript">
function addFile(){
/*
* 因为文件选取框定义在行对象中。
* 所以只要给表格创建新的行和单元格即可。
*/
var oTabNode = document.getElementById("fileid");
var oTrNode = oTabNode.insertRow();
var oTdNode_file = oTrNode.insertCell();
var oTdNode_del = oTrNode.insertCell();
oTdNode_file.innerHTML = "<input type='file' />";
// oTdNode_del.innerHTML = "<a href='javascript:void(0)' onclick='deleteFile(this)'>删除附件</a>";
oTdNode_del.innerHTML = "<img src='1.jpg' alt='删除附件' onclick='deleteFile(this)' />";
}
function deleteFile(node){
var oTrNode = node.parentNode.parentNode;
oTrNode.parentNode.removeChild(oTrNode);
}
</script>
</head>
<body>
<table id="fileid">
<tr>
<td><a href="javascript:void(0)" onclick="addFile()">添加附件</a></td>
</tr>
<!--tr>
<td><input type="file" /> </td>
<td><a href="javascript:void(0)">删除附件</a></td>
</tr-->
</table>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Untitled Document</title>
<style type="text/css">
table a:link,table a:visited{
color:#179ed9;
text-decoration:none;
}
table a:hover{
color:#f36021;
}
</style>
<script type="text/javascript">
function addFile(){
/*
* 因为文件选取框定义在行对象中。
* 所以只要给表格创建新的行和单元格即可。
*/
var oTabNode = document.getElementById("fileid");
var oTrNode = oTabNode.insertRow();
var oTdNode_file = oTrNode.insertCell();
var oTdNode_del = oTrNode.insertCell();
oTdNode_file.innerHTML = "<input type='file' />";
// oTdNode_del.innerHTML = "<a href='javascript:void(0)' onclick='deleteFile(this)'>删除附件</a>";
oTdNode_del.innerHTML = "<img src='1.jpg' alt='删除附件' onclick='deleteFile(this)' />";
}
function deleteFile(node){
var oTrNode = node.parentNode.parentNode;
oTrNode.parentNode.removeChild(oTrNode);
}
</script>
</head>
<body>
<table id="fileid">
<tr>
<td><a href="javascript:void(0)" onclick="addFile()">添加附件</a></td>
</tr>
<!--tr>
<td><input type="file" /> </td>
<td><a href="javascript:void(0)">删除附件</a></td>
</tr-->
</table>
</body>
</html>
相关文章推荐
- 解析JSON
- javascript call 详细解释
- js实现省市选择二级联动
- wexinjs 调用
- js操作下拉标签select
- 【看了一篇解释javascript中的上下文对象的,比较深刻】深入理解Javascript之执行上下文(Execution Context)
- 网页引用外部js脚本文件时必须是(转)
- jsonp实现原理详细介绍
- javascript 判断是否为字符串对象
- JavaScript 运行机制详解:再谈Event Loop
- js上传图片,进行预览
- 视差滚动插件Stellar.js
- JS Date.Format
- JS 获取 本周、本月、本季度、本年、上月、上周、上季度、去年
- 如何实现序列化为json
- Javascript、PHP交互的实现
- js基础1-深入理解javascript之this
- js刷新页面方法大全
- 深入理解javascript之this
- 20150623 javascript实现的简单刷贴