<!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. struts2标签之列求和

    struts2标签之列求和 <table width="100%" border="0" cellpadding="0" cellsp ...

  2. Reactivecocoa初级使用

    一直听闻ReactiveCocoa(以下简称RAC)的大名,但始终没有使用.最近时间比较空闲就决定研究一下. 在配置RAC时候遇到了一个小麻烦需要说明本人用cocoapods管理第三方框架,于是按照正 ...

  3. jQuery Jcrop API参数说明(中文版)(转)(图片剪切)

    Jcrop是一个jQuery图片裁剪插件,它能为你的WEB应用程序快速简单地提供图片裁剪的功能.特点如下: 对所有图片均unobtrusively(无侵入的,保持DOM简洁) 支持宽高比例锁定 支持 ...

  4. (六)C语言之typedef详解

    1.typedef可以看作type define的缩写,顾名思义就是类型定义,也就是说它只是给已有的类型重新定义了一个方便使用的别名,并没有产生新的数据类型.typedef的使用与宏定义define有 ...

  5. djangoadmin导出csv

    from django.contrib import admin from .models import Order,OrderItem from django.http import HttpRes ...

  6. vitamio 缓冲一部分时，loading还没消失，直接点击播放，loading未能消失

    在videoView的start()中 添加loading消失语句,效果很好 ,也没有出现任何问题

  7. dx中纹理相关的接口备注

    1.内存中的纹理保存到文件 HRESULT D3DXSaveTextureToFile( __in LPCTSTR pDestFile, __in D3DXIMAGE_FILEFORMAT DestF ...

  8. 日期操作类--SimpleDateFormat类

    使用SimpleDateFormat格式化日期 SimpleDateFormat是一个以语言环境敏感的方式来格式化和分析日期的类.SimpleDateFormat允许你选择任何用户自定义日期时间格式来 ...

  9. Java并发编程：并发容器之CopyOnWriteArrayList

    转载: Java并发编程:并发容器之CopyOnWriteArrayList Copy-On-Write简称COW,是一种用于程序设计中的优化策略.其基本思路是,从一开始大家都在共享同一个内容,当某个 ...

  10. robotframework笔记17

    执行测试用例 基本用法 机器人框架从命令行执行测试用例,和 最终的结果是,在默认情况下,一个 输出文件 以XML格式和一个HTML 报告 和 日志 . 执行后,可以组合和输出文件 否则 进行后期处理  ...