Jquery动态添加 删除 操作实现

这是gridView为空数据时显示的表头

下面直接填代码:

 function Add() {
          //动态添加行
        $("#gridCustomerView").append("<tr class='rowdel' align='center'>"
                                + "<td style='width:80px'>" + $("#txtCpname").val() + "</td>"
                                + "<td style='width:90px'>" + $("#txtCpname").val() + "</td>"
                                + "<td style='width:80px'>" + $("#txtCPS").val() + "</td>"
                                + "<td style='width:60px'>" + $("#txtPhone").val() + "</td>"
                                + "<td style='width:80px'>" + $("#txtFax").val() + "</td>"
                                + "<td style='width:90px'>" + $("#txtAddress1").val() + "</td>"
                                + "<td style='width:90px'>" + $("#txtAddress2").val() + "</td>"
                                + "<td style='width:50px'>" + $("#txtAddress3").val() + "</td>"
                                + "<td style='width:50px'>" + $("#txtRemarle").val() + "</td>"
                                + "<td style='width:80px'> <a href=\'#\' οnclick=\'deltr'>修改</a> <a href=\'#\' οnclick=\'JsDelete(this)\'>删除</a></td>"    
                                + "</tr>");
    }

  function JsDelete(obj) {
        if (confirm('确定删除')) {
            delIndex(obj);
        }
        
    }
    function delIndex(obj) {
        //var rowIndex = obj.parentNode.parentNode.rowIndex; //获得行下标
        //$(obj).parent("td").parent("tr").css("background", "yellow");//背景颜色
        $(obj).parent("td").parent("tr").css("background", "yellow").remove();//删除当前行
    }

  上一下效果图:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值