<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
var bCount=1;
var xCount=1;
function addBao(){
var newRow=baoyang.insertRow(baoyang.rows.length);
newRow.id="trb";
newRow.ln=bCount;

var Input1=newRow.insertCell(0);
Input1.ln=bCount;
Input1.innerHTML='<input id="typeId" type="text" name="typeId" style="width:40" value="'+bCount+'">';

var Input2=newRow.insertCell(1);
Input2.ln=bCount;
Input2.innerHTML='<input type="text" id="dictCode" name="dictCode" style="width:80">';

var Input3=newRow.insertCell(2);
Input3.ln=bCount;
Input3.innerHTML='<input type="text" id="dictName" name="dictName" style="width:80">';

var Input3=newRow.insertCell(3);
Input3.ln=bCount;
Input3.innerHTML='<input type="text" id="remark" name="remark" style="width:80">';

var Del=newRow.insertCell(4);
Del.ln=bCount;
Del.onclick=delBao;
Del.innerHTML='<input type="button" name="Button" style="width:40" value=" 删除 " ln='+bCount+'>';

bCount++;
}

function delBao(event){
var event = event? event: window.event
var img = event.srcElement ? event.srcElement:event.target;
var trb = document.getElementById("baoyang");
var rows = trb.rows;
var trbline=parseInt(img.parentElement.ln,10);
if (trbline>0) {
for (var i=1;i<rows.length;i++){
if (rows[i].ln==trbline){
baoyang.deleteRow(i);
}
}
}
}

function addXin(){
var newRow=xintian.insertRow(xintian.rows.length);
newRow.id="trx";
newRow.ln=xCount;

var Input1=newRow.insertCell(0);
Input1.ln=xCount;
Input1.innerHTML='<input type="text" id="dataId" name="dataId" style="width:40" value="'+xCount+'">';

var Input2=newRow.insertCell(1);
Input2.ln=xCount;
Input2.innerHTML='<input type="text" id="dicDataName" name="dicDataName" style="width:90">';

var Input3=newRow.insertCell(2);
Input3.ln=xCount;
Input3.innerHTML='<select id="dicType" name="dicType" > <option value="" selected="selected">[请选择标识]</option></select>';

Del=newRow.insertCell(3);
Del.ln=xCount;
Del.onclick=delXin;
Del.innerHTML='<input type="button" name="Button" style="width:40" value=" 删除 " ln='+xCount+'>';

xCount++;
}
function delXin(event){
var event = event? event: window.event
var img = event.srcElement ? event.srcElement:event.target;
var trx = document.getElementById("xintian");
var rows = trx.rows;
var trline=parseInt(img.parentElement.ln,10);
if (trline>0) {
for (var i=1;i<rows.length;i++){
if (rows[i].ln==trline){
xintian.deleteRow(i);
}
}
}
}
</script>

</head>

<body>
<table width="707" cellspacing="0" cellpadding="0" border="0" class="uniformstyle" id="myform">
<tbody>
<tr>
<td valign="top">
<table class="myformstyle" id="baoyang">
<tr id="trb">
<td style="width:40">序号</td>
<td style="width:80">标识编码</td>
<td style="width:80">标识分类名称</td>
<td style="width:80">备注</td>
<td style="width:50"><input type="button" value="添加" onclick="addBao()" style="width:40"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top">
<table class="myformstyle" id="xintian">
<tr id="trx">
<td style="width:40">序号</td>
<td style="width:90">名称</td>
<td style="width:40">标识分类</td>
<td style="width:40"><input type="button" value="添加" onclick="addXin()" style="width:40"></td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>

-----来源http://blog.csdn.net/maypol/article/details/5372744

js动态添加删除行，兼容ie和火狐的更多相关文章

  1. 原生JS动态添加和删除类

    原生JS动态添加和删除类 由于需要, 给按钮组监听点击事件(要求用事件委托),当有一个按钮被点击时,相应的给该按钮添加一个类(激活类),其他没有点击的按钮就要移出该类 添加和和删除类有三种方法 首先等 ...

  2. js动态添加onload、onresize、onscroll事件(另类方法)

    js动态添加onload.onresize.onscroll事件(另类方法)   window 的 onload.onresize.onscroll 事件,跟其他的事件不一样,它不能用 attachE ...

  3. form表单 无法提交js动态添加的表单元素问题。。

    第一种情况, 这种情况js动态添加的表单元素是不能提交到服务器端的 <table> <form method="post" action=" url   ...

  4. 【原生js】js动态添加dom，如何绑定事件

    首先要明白浏览器在加载页面的时候是按顺序来加载的,这样以来就很清楚了,js动态添加dom以后,这些dom并没有绑定事件,这个时候最简单的一个办法就是:将绑定事件的方法封装到一个函数A中,在动态添加完d ...

  5. 使用js动态添加组件

    在文章开始之前,我想说两点 1 自己初学js,文章的内容在大神看来可能就是不值一提,但是谁都是从hello world来的,望高   手不吝指教# 2 我知道这个标题起的比较蛋疼,大家看图就能说明问题 ...

  6. MUI 里js动态添加数字输入框后，增加、减少按钮无效

    numbox 的自动初化是在 mui.ready 时完成的mui 页面默认会自动初始化页面中的所有数字输入框,动态构造的 DOM 需要进行手动初始化.比如:您动态创建了一个 ID 为 abc 的数字输 ...

  7. 原生js动态添加style，添加样式

    原生js动态添加style,添加样式 第一种 var style="[assign-url='"+str+"']{display:initial}"; var ...

  8. Js动态添加复选框Checkbox

    Js动态添加复选框Checkbox的实例方法!!! 首先,使用JS动态产生Checkbox可以采用如下类似的语句: var checkBox=document.createElement(" ...

  9. js 动态添加表单 table tr

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. ABAP-消息发布

    FUNCTION ZSDI0009_DO_INFOMESSAGE. *"----------------------------------------------------------- ...

  2. Git----分支管理之bug分支04

    ---恢复内容开始--- 软件开发中,bug就像家常便饭一样,有了bug就需要修复,在Git中,由于分支是如此强大,所以,每个bug都可以通过一个临时分支来修复,修复后,合并分支,然后将临时分支删除. ...

  3. Json字符串转Dictionary

    /// <summary> /// json字符串转Dictionary /// </summary> /// <param name="json"& ...

  4. pip cannot confirm SSL certificate: SSL module is not available

    centos6.8编译安装python2.7之后,使用pip报错:pip cannot confirm SSL certificate: SSL module is not available 解决方 ...

  5. SVM支持向量机推导，工具介绍及python实现

    支持向量机整理 参考: Alexandre KOWALCZYK大神的SVM Tutorial http://blog.csdn.net/alvine008/article/details/909711 ...

  6. 使用robotium对android应用进行自动化测试

    所需要的环境: 1.eclipse 2.android development tools(ADT) 3.software develoment kit(SDK) 4.JDK 5.robotium 1 ...

  7. Java含有Date的对象序列化网络传输

    与短信接口对接时,Date从我这边传输以及在短信平台接收后转换出了问题 传入一个TemplateRequest对象 Feign接口 将含有Date的将要传输的TemplateRequest加上@Req ...

  8. sdc docker连接

    curl -O https://raw.githubusercontent.com/joyent/sdc-docker/master/tools/sdc-docker-setup.sh &&a ...

  9. Ubuntu 18.04上安装R及Rstudio

    安装R引用自:https://www.howtoing.com/how-to-install-r-on-ubuntu-18-04 安装Rstudio引用自:https://www.rstudio.co ...

  10. referer null

    Referer表示超链接源的URL!你想看到实验效果,要从a-->(能过<a href="b.jsp")b页面,然后在B里可以取得Refere参数! String ur ...