JS动态添加table行,HTML控件,获取HTML控件中信息

 

<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>

    <script language="javascript" type="text/javascript">
        //添加行
        function insertRow()
        {
            newRow=document.all.yltable.insertRow(-1);
            var j_1=document.all.yltable.rows.length;
            newcell=newRow.insertCell();
           
            newRow.bgColor='#FFFFFF';
            newcell.align='center';
            newcell.innerHTML=""+j_1+"";
            newcell=newRow.insertCell();
           
           
            newRow.bgColor='#FFFFFF';
            newcell.align='center';
            newcell.innerHTML="<input type='text' name='ylText"+j_1+"' id='ylText"+j_1+"'/>";
            newcell=newRow.insertCell();
           
            newRow.bgColor='#FFFFFF';
            newcell.align='center';
            newcell.innerHTML="<input type='text' name='hei"+j_1+"' id='hei"+j_1+"' />";
            newcell=newRow.insertCell();
           
            newRow.bgColor='#FFFFFF;';
            newcell.align='center';
            newcell.innerHTML='<input name="button3" type="button" value="删除" οnclick="return DelRow()"> <input name="btnAdd" type="button" value="添加" οnclick="AddInfo('+j_1+')">';
            document.all.yltable.focus();
        }
        function DelRow()
        {
            var currRowIndex=event.srcElement.parentNode.parentNode.rowIndex;
            document.all.yltable.deleteRow(currRowIndex);
        }
        function AddInfo(id)
        {
            window.location.href="tableText1.aspx?hei="+$("#hei"+id).val()+"&ylText="+$("#ylText"+id).val();
           
        }
    </script>

 

<div>
        <input type="button" name="AddRow" id="AddRow" value="添加一行" οnclick="insertRow()" />
        <table border="1" align="center" width="50%" id="yltable">
            <tbody id="yl1">
                <tr>
                    <td height="22" class="style1">
                        <div align="center">
                            1</div>
                    </td>
                    <td width="40%">
                        <div align="center">
                            <input name="textfield" type="text" value="">
                        </div>
                    </td>
                    <td width="40%">
                        <div align="center">
                            <input name="textfield" type="text" value="">
                        </div>
                    </td>
                    <td width="30%">
                        <div align="center">
                            <input name="button3" type="button" value="删除" οnclick="return DelRow()">
                        </div>
                    </td>
                </tr>
            </tbody>
            <tbody id="yl2">
                <tr>
                    <td class="style1">
                        <div align="center">
                            2</div>
                    </td>
                    <td>
                        <div align="center">
                            <input name="textfield2" type="text" value="">
                        </div>
                    </td>
                    <td>
                        <div align="center">
                            <input name="textfield2" type="text" value="">
                        </div>
                    </td>
                    <td>
                        <div align="center">
                            <input name="button3" type="button" value="删除" οnclick="return DelRow()">
                        </div>
                    </td>
                </tr>
            </tbody>
            <tbody id="yl3">
                <tr>
                    <td class="style1">
                        <div align="center">
                            3</div>
                    </td>
                    <td>
                        <div align="center">
                            <input name="textfield22" type="text">                        

 </div>
                    </td>
                    <td>
                        <div align="center">
                            <input name="textfield22" type="text" >
                        </div>
                    </td>
                    <td>
                        <div align="center">
                            <input name="button3" type="button" value="删除" οnclick="return DelRow()">
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值