动态添加表单

来源：互联网发布：自学考试网络助学编辑：程序博客网时间：2024/05/01 01:07

<%@ page language="java" pageEncoding="gb2312"%>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<title>test</title>
<script type="text/javascript">

function IsIE()
{
    if (window.navigator.userAgent.indexOf("MSIE")>=1)
    {
        //IE浏览器
       return true;
    }else{
        return false;
   }
}
function IsFF()
{
    if (window.navigator.userAgent.indexOf("Firefox")>=1)
    {
        //Firefox
       return true;
    }else{
        //如果浏览器为其他
       return false;
    }
}

function IsOther()
{
    if (window.navigator.userAgent.indexOf("MSIE")>=1)
    {
        //IE浏览器
    }else{
        if (window.navigator.userAgent.indexOf("Firefox")>=1)
        {
            //Firefox
        }else{
            //如果浏览器为其他
           return true;
        }
    }
   return false;
}

function resetRow()
{
    document.location.reload();
}

function addRow()
{
    if (IsFF()==true)
   {
        addRowFF();
   }
    if (IsIE()==true)
   {
        addRowIE();
   }
}

//FF
function addRowFF()
{
    var tb = document.getElementById('tblList');

    tb.appendChild(createTR());
    return true;
}
//FF
function createTd(objTag, objType, objName, objClass, colNum)
{
    var td = null;
   td = document.createElement('td');
    obj = document.createElement(objTag);
    obj.type      = objType;
   if (colNum!=null && colNum>1)
   {
        td.colSpan   = colNum;
   }
   obj.className = objClass;
   obj.name      = objName;
   td.appendChild(obj);
   return td;
}
function createTR()
{
   var tr = document.createElement('tr');
   var no = document.getElementById('hidTotal').value;
   no++;
   document.getElementById('hidTotal').value = no;
        alert(document.getElementById('hidTotal').value);
   tr.appendChild(createTd("input", "text", "birth_date" + no, "jiaotong2",2));
   tr.appendChild(createTd("input", "text", "addr_start" + no, "jiaotong1"));
   tr.appendChild(createTd("input", "text", "addr_end" + no , "jiaotong2"));
   //tr.appendChild(createTd("input", "text", "bus_fees" + no , "jiaotong1"));
   return tr;
}

//IE
function addRowIE()
{
    var row = createTR();
    document.getElementById('tagTb').appendChild(row);
    //alert(document.getElementById('divBody').innerHTML);
}
</script>
</head>
<body>
总体整个表只能有一个 div
<Form name=frmMain>
<div id="divBody">
<table border="1" id="tblList">
<TBODY id="tagTb">
<tr>
    <td>name</td>
    <td>age</td>
    <td>academic</td>
    <td>nation</td>
<tr>
<tr>
    <td colspan="4">
       <input type='button' value='添加一行' onclick='addRow();'></input>
       <input type='button' value='恢复状态' onclick='resetRow();'></input>
    </td>
</tr>
</tbody>
</table>
<input type=hidden name=hidTotal id=hidTotal value=0>
</div>
</Form>
</body>
</html>