给某一表格动态添加行、删除行

时间:2022-12-08 15:56:19

//动态添加行 

function AddDataRow() {

            //1、找到要添加行的表格
            var objTable = document.getElementById("myTable"); 

            //2、添加一个新的行

            var objRow = objTable.insertRow(); //在数据表中插入新行

    //3、给每一行取一个ID        

        var iMaxNum = parseInt(document.getElementById("iMaxNum").value) + 1;
            document.getElementById("iMaxNum").value = iMaxNum;
            objRow.id = "Row_" + iMaxNum;
            //创建一个【年份】单元格
            var objYear = document.createElement("<td align='center'>");
            objYear.innerHTML = "<input type='text' id='Row" + iMaxNum.toString() + "_Year' name='Row_" + iMaxNum + "_Year' value='' class=\"content\" data_chk=\"year\"/>";
            objRow.appendChild(objYear);

            //创建一个【新增产值】单元格
            var objOutputValue = document.createElement("<td align='center'>");
            objOutputValue.innerHTML = "<input type='text' id='Row" + iMaxNum.toString() + "_OutputValue' name='Row_" + iMaxNum + "_OutputValue' value=''class=\"content\" data_chk=\"num\"/>";
            objRow.appendChild(objOutputValue);

            //创建一个【新增利润】单元格
            var objProfit = document.createElement("<td align='center'>");
            objProfit.innerHTML = "<input type='text' id='Row" + iMaxNum + "_Profit' name='Row_" + iMaxNum + "_Profit' class=\"content\" data_chk=\"num\"/>";
            objRow.appendChild(objProfit);

            //创建一个【新增税收】单元格
            var objTax = document.createElement("<td align='center'>");
            objTax.innerHTML = "<input type='text' id='Row" + iMaxNum + "_Tax' name='Row_" + iMaxNum + "_Tax' class=\"content\"  maxlength=\"11\" data_chk=\"num\"/>";
            objRow.appendChild(objTax);

            //创建一个【创收外汇】单元格
            var objExchange = document.createElement("<td align='center'>");
            objExchange.innerHTML = "<input type='text' id='Row" + iMaxNum + "_Exchange' name='Row_" + iMaxNum + "_Exchange'  class=\"content\"  maxlength=\"11\" data_chk=\"num\"/>";
            objRow.appendChild(objExchange);

            //创建一个【节支总额】单元格
            var objTotalValue = document.createElement("<td align='center'>");
            objTotalValue.innerHTML = "<input type='text' id='Row" + iMaxNum + "_TotalValue' name = 'Row_" + iMaxNum + "_TotalValue' maxlength=\"11\"  class=\"content\"/>";
            objRow.appendChild(objTotalValue);

            //创建一个【删除】单元格
            var objCell_Del = document.createElement("<td align='center'>");
            objCell_Del.innerHTML = "<input type='button' id='Row" + iMaxNum + "F_Del' value='删除' onclick='DelDataRow(" + iMaxNum + ")' class=\"divButtons_Button\"/>";
            objRow.appendChild(objCell_Del);

        }

 

//删除动态创建的行

//根据行号删除行
        function DelDataRow(rowNum) {
                       if (confirm("你确认要删除【" + document.getElementById("Row" + rowNum.toString() + "_Year").value + "年】的数据吗?") == false)
            { return false; }
           //通过行编号取得该行对象
            var objRow = document.getElementById('Row_' + rowNum);
            if (objRow) {
                var objTable = objRow.parentNode;
                if (objTable.rows.length > 3) {//当行数大于3时,才能够删除
                    objTable.removeChild(objRow);
                    //当删除一行的时候将行数减去1
                    var iMaxNum = parseInt(document.getElementById("iMaxNum").value) - 1;
                    document.getElementById("iMaxNum").value = iMaxNum;
                }
            }
        }