通过Javascript自定义添加输入框

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRansitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dTD">
<html>
<head>
<title>test</title>
  <script type="text/javascript">
function addRow(objTable){
//取得指定表格的TBODY
var tbodyOnlineEdit=objTable.getElementsByTagName("TBODY")[0];
//取得指定表格的THEAD
var theadOnlineEdit=objTable.getElementsByTagName("THEAD")[0];
//复制TBODY的最后一个TR并赋值给elm
var elm = tbodyOnlineEdit.lastChild.cloneNode(true);
elm.style.display="";
//把elm插入到TBODY并做为TBODY的一个子元素
tbodyOnlineEdit.insertBefore(elm);
}
           
 </script>
</head>
<body>
    <form id="Form1" method="post" runat="server">
        <table id="QueryDataTable" cellspacing="1" summary="自动添加输入框" style="width:600px;">
            <caption>
                测试</caption>
            <thead>
                <tr>
                    <th width="20%">
                        姓  名</th>
                    <th width="20%">
                        年  龄</th>
                    <th width="20%">
                        性  别</th>
                </tr>
            </thead>
            <tbody>
                <tr class="odd">
                    <td>
                        <input type="text" name="txtGoodsName" value="测试1" />
                    </td>
                    <td>
                       <input type="text" name="txtPrice" value="10000" />
                    </td>
                    <td>
                        <input type="text" name="txtQuantity" value="男" />
                    </td>
                </tr>
 </tbody>
 <input type=button value="添加空数据行">
 
        </table>


    </form>
</body>
</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章