<!DOCTYPE html>

<html>

  <head>

    <title>linshi3.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="this is my page">

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

    <script type="text/javascript">

        function insertAddress()

        {

            insertRow('t2','t1');

            //setAddressNo();

            //setAddressNum();

        }

        function insertRow(pageCode,dataPageCode)

        {

                    var oTBODY     = document.getElementById(pageCode).tBodies.item(0);//Address

          var oTBODYData = document.getElementById(dataPageCode).tBodies.item(0);//Address_date

          var rowsCount = oTBODYData.rows.length;//1

          for(var i=0;i<rowsCount;i++){

            oTBODY.appendChild(oTBODYData.rows[i].cloneNode(true));

          }

                }

        function deleteAddress(field,intPageDataKeyCount,intRowCount)//this,1,1

        {

          var arrayAddressNo = new Array();

          var strFieldName = field.name;//button_Address_Delete,假如有3个数据

         var intAddressNo = 0;

          var index = 0;

          var i = 0;

          //得到行索引

          for(i=1;i<fm.all(strFieldName).length;i++)//1--2

          {

            if(fm.all(strFieldName)[i]==field)

            {

              index = i;

              break;

            }

          }

         // intAddressNo = parseInt(fm.AddressNo[index].value,10);

                  deleteRow('t2',field,intPageDataKeyCount,intRowCount);

          //'Address',field,intPageDataKeyCount,intRowCount

        }

        function deleteRow(PageCode,Field,intPageDataKeyCount,intRowCount)//'Address',this,1,1

        {

          if (intPageDataKeyCount==null)

          {

            intPageDataKeyCount = 1;

          }

          if (intRowCount==null)

          {

            intRowCount = 1;

          }

          intRowCount = 4;

          var intIndex = parseInt(getElementOrder(Field),10) - 1;  //顺序改为以0开始

          var oTBODY   = document.all(PageCode).tBodies.item(0);

          for(var i=0;i<4;i++)

          {

            oTBODY.deleteRow(0);

          }

        }

        function getElementOrder(field,frm)

        {

          var intOrder = 0;

          var intCount = getElementCount(field.name,frm);

          var frmForm = (frm==null?document.fm:frm);

          if(intCount>1)

          {

            for(var i=0;i<intCount;i++)

            {

              if(frmForm.all(field.name)[i].name==field.name)

              {

                intOrder++;

              }

              if(frmForm.all(field.name)[i]==field)

              {

                break;

              }

            }

          }

          else

          {

            intOrder = 1;

          }

          return intOrder;

        }

        function getElementCount(strFieldName,frm)

        {

          var intCount = 0;

          var frmForm = (frm==null?document.fm:frm);

          try

          {

            intCount = eval( frmForm.all(strFieldName).length );

            if(isNaN(intCount)) intCount = 1;

          }

          catch(E)

          {

            intCount = 0;

          }

                    if(intCount>1 && frmForm.all(strFieldName)[0].tagName=="OPTION")

          {

            intCount = 1;

          }

          return intCount;

        }

    </script>

  </head>

  <body>

    <form name="fm" id="f1" action="" method="post">

      <table border="0" style="display: " id="t2">

       <thead>

       </thead>

       <tfoot>

        <tr class="common">

              <td id="" >

                <p align="right">

                      <input type="button" name="button_Address_Insert" class="button" alt="新增" value="新 增"

                          onclick="insertAddress()">

                </p>

              </td>

        </tr>

       </tfoot>

       <tbody><!-- 增加的区域数据，在这儿 -->

       </tbody>

      </table>

      <table border="0" style="display: none" id="t1">

       <tbody>

        <tr>

          <td>Login:</td>

          <td><input type="text" name="login" id="login"></td>

        </tr>

        <tr>

          <td>Password:</td>

          <td><input type="password" name="password" id="password"></td>

        </tr>

        <tr>

          <td colspan="2" align="center"><input type="submit"></td>

        </tr>

        <tr>

            <td>

                <input type="button" name="button_Address_Delete" class="button" alt="删除" value="删除"

                          onclick="deleteAddress(this,1,1)">

            </td>

        </tr>

       </tbody>

      </table>

    </form>

  </body>

</html>

js方法控制html表格的增加和删除的更多相关文章

  1. 使用js方法将table表格中指定列指定行中相同内容的单元格进行合并操作。

    前言 使用js方法对html中的table表格进行单元格的行列合并操作. 网上执行此操作的实例方法有很多,但根据实际业务的区别,大多不适用. 所以在网上各位大神写的方法的基础上进行了部分修改以适合自己 ...

  2. js回车动态添加表格，右键动态删除表格行

    <script type="text/javascript" language="javascript">//屏蔽浏览器右键function sto ...

  3. java layout 表格项增加、删除、修改

    实现的内容为:点击表格某项,再点击删除钮,可实现删除点击表格某项,再点击编辑按钮,可实现内容改变点击添加按钮,可实现向表格中添加内容 总结:总的来说中间遇到了很多困难,但是都一步步的解决了. pack ...

  4. vue.js（10）--案例--列表增加与删除

    品牌管理案例 (1)bootstrip快速布局 <div class="app"> <div class="panel panel-primary&qu ...

  5. UITableView增加和删除、移动

    复习一下: 1.在控制器上添加一个UITableView,  暂时该UITableView控件变量名命名为为tableView, 设置控件代理,实现控制器的UITableViewDataSource, ...

  6. js如何动态创建表格（两种方法）

    js如何动态创建表格(两种方法) 一.总结 一句话总结: 1.方法一:写好创建表格的html代码,将之赋值给div的innerHTML. 2.方法二.直接用创建好的table元素的方法insertRo ...

  7. js中控制小数点的显示位数的技术整理

    js中自带方法控制小数点的显示位数(四舍五入) alert((12.9299).toFixed(2)); //12.93 alert((12.9243).toFixed(2)); //12.92 小数 ...

  8. 网站开发进阶(二十五)js如何将html表格导出为excel文件

    js如何将html表格导出为excel文件        赠人玫瑰,手留余香.若您感觉此篇博文对您有用,请花费2秒时间点个赞,您的鼓励是我不断前进的动力,共勉! jsp页面数据导出成excel的方法很 ...

  9. jQuery实现表格行的动态增加与删除(改进版)

    之前写过一个简单的利用jQuery实现表格行的动态增加与删除的例子,有些人评论说"如果表格中是input元素,那么删除后的东西都将自动替换,这样应该是有问题的,建议楼主改进!",故 ...

随机推荐

  1. [转载] 一致性问题和Raft一致性算法

    原文: http://daizuozhuo.github.io/consensus-algorithm/ raft 协议确实比 paxos 协议好懂太多了. 一致性问题 一致性算法是用来解决一致性问题 ...

  2. 百度之星Astar2016 Round2A

    All X 等比数列求和一下 A/B MOD C = A MOD (B*C) / B  或者分治一下 Sitting in Line 状压+拓扑dp dp(i, j)表示当前二进制状态为j,当前状态的 ...

  3. Android linearlayout常用布局

    用linearlayout完成这样的布局效果,这样的布局还是比较常用的,具体的xml代码如下: <LinearLayout xmlns:android="http://schemas. ...

  4. MySQL忘记root密码--skip-grant-tables

    使用--skip-grant-tables选项启动MYSQL时,服务器将不加载权限判断,这样就可以进行授权和密码更新操作了,具体步骤如下: 1. 停止mysql /etc/init.d/mysqld ...

  5. MATLAB中的nargin与varargin的用法

    nargin的用法: nargin:number of function input arguments,指的是一个函数的输入变量的个数. 用法:nargin或着nargin(fx), 其中fx指的是 ...

  6. Java编程思想学习笔记_1(Java内存和垃圾回收)

    1.Java中对象的存储数据的地方: 共有五个不同的地方可以存储数据. 1)寄存器.最快,因为位于处理器的内部,寄存器按需求分配,不能直接控制. 2)堆栈.位于通用RAM,通过堆栈指针可以从处理器那里 ...

  7. phalcon: dispatcher调度控制器

    phalcon: dispatcher调度控制器 我所理解的dispatcher调度控制器,实际上是对 router或者特定的url参数给与重组. 引用特定的类: //add use Phalcon\ ...

  8. Open-falon监控安装过程

    Open-falon监控安装过程   具体参考:   http://book.open-falcon.org/zh/quick_install/prepare.html 1. 安装ntp.vim编辑器 ...

  9. 项目框架开发流程（oa项目为例）

    1. 导包 2. 配置web.xml 3. 设计通用dao ,base,service, action, domain  ,utils等 4.配置struts.xml 和 beans.xml 5. 配 ...

  10. osx 10.11.5 El Capitan U盘制作安装

    osx 10.11.5 El Capitan U盘制作安装 1. 下载osx10.11.5 从mac的 appstore下载(官方原版) 2. U盘8G起(注意备份重要资料) 3. 下载完成之后在Fi ...