通過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>

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