js方法控制html表格的增加和删除

<!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表格的增加和删除

最新文章

热门文章
