js动态添加td,tr

//新增机器人信息的
function insertRows(rr){

        //var tab=document.getElementById('tableid');
        var tb1 = $("#tableid"); 
        var tempRow=parseInt($("#tableid tr").size());

        var shu=parseInt(rr)+1;
        var ss="<option value=''></option>";
        <c:forEach items="${robolist}" var="r">
            ss+="<option value='${r.robotserialno}'>${r.robotnickname}</option>";
        </c:forEach>

        if((parseInt(rr+1)== tempRow)){
            $("#tableid tr:eq("+rr+")").after("<tr id='tr"+tempRow+"'  ><td  class='tdcss2'>机器人:</td><td class='controls'><select id='sele"+tempRow+"' name='teams["+tempRow+"].robot' value=''  class='required selecss'   onchange='queryGroup(this.value,"+tempRow+")'>"+ss+"</select></td><td  class='tdcss'>群名称:</td><td class='controls'><div id='ttqu"+tempRow+"'><select id='ssess"+tempRow+"' name='teams["+tempRow+"].groupname' value='' class='required selecss'></select></div></td><td class='controls'><a  id='addtian"+tempRow+"'   onclick='insertRows("+tempRow+")'><img alt='' src='${ctxStatic}/images/add.jpg'  style='height:21px; width:24px;margin-top: 8px;'></a> &nbsp&nbsp&nbsp<a id='delet"+tempRow+"' onclick='delRows("+tempRow+")'><img alt='' src='${ctxStatic}/images/dele.jpg'  style='height:21px; width:24px;margin-top: 8px;'></a></td></tr>");
        }else{

            for (i=tempRow-1;i>=shu;i--){
                $("#tr"+i).attr("id","tr"+(i+1)+"");
                 $("#delet"+i+"").attr("onclick","delRows("+(i+1)+")");
                $("#addtian"+i).attr("onclick","insertRows("+(i+1)+")");
                 $("#ttqu"+i).attr("id","ttqu"+(i+1)+"");
                 $("#delet"+i+"").attr("id","delet"+(i+1)+"");
                 $("#addtian"+i).attr("id","addtian"+(i+1)+"");
                $("#sele"+i).attr("name","teams["+(i+1)+"].robot");
                $("#sele"+i).attr("onchange","queryGroup(this.value,"+(i+1)+")");
                $("#ssess"+i).attr("name","teams["+(i+1)+"].groupname");
                $("#sele"+i).attr("id","sele"+(i+1)+"");
                $("#ssess"+i).attr("id","ssess"+(i+1)+"");

            }

            $("#tableid tr:eq("+rr+")").after("<tr id='tr"+shu+"' ><td  class='tdcss2'>机器人:</td><td class='controls'><select id='sele"+shu+"' name='teams["+shu+"].robot' value=''  class='required selecss' onchange='queryGroup(this.value,"+shu+")'>"+ss+"</select></td><td  class='tdcss'>群名称:</td><td class='controls'><div id='ttqu"+shu+"'><select id='ssess"+shu+"' name='teams["+shu+"].groupname' value=''  class='required selecss'></select></div></td><td class='controls'><a  id='addtian"+shu+"'   onclick='insertRows("+shu+")'><img alt='' src='${ctxStatic}/images/add.jpg'  style='height:21px; width:24px;margin-top: 8px;'></a> &nbsp&nbsp&nbsp<a id='delet"+shu+"' onclick='delRows("+shu+")'><img alt='' src='${ctxStatic}/images/dele.jpg'  style='height:21px; width:24px;margin-top: 8px;'></a></td></tr>");
        }


    } 




    //删除tr和td并且移动后面的tr和td且下标要一致 
    function delRows(sub){
        var rowNum=sub;  //此处的规律是:行号为下标+1
        var tb1 = $("#tableid");  //找table的ID
        var tempRow = $("#tableid tr").size();//获取表格的行数

        if (tempRow >rowNum){ 
        $("#tr"+sub).remove();  //删除tr
        for (i=(parseInt(sub)+1);i<tempRow;i++){
            $("#tr"+i).attr("id","tr"+(i-1)+"");
            $("#addtian"+i).attr("onclick","insertRows("+(i-1)+")");
            $("#delet"+i+"").attr("onclick","delRows("+(i-1)+")");
            $("#delet"+i+"").attr("id","delet"+(i-1)+"");
             $("#addtian"+i).attr("id","addtian"+(i-1)+"");
            $("#sele"+i).attr("name","teams["+(i-1)+"].robot");
            $("#sele"+i).attr("onchange","queryGroup(this.value,"+(i-1)+")");
            $("#ssess"+i).attr("name","teams["+(i-1)+"].groupname");
            $("#ttqu"+i).attr("id","ttqu"+(i-1)+"");
            $("#sele"+i).attr("id","sele"+(i-1)+"");
            $("#ssess"+i).attr("id","ssess"+(i-1)+"");

             }    
        }

    }
机器人: 群名称:
请先选择机器人!

这里写图片描述

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值