jquery动态新增/移除表格行

html代码,select标签部分用到了angular的循环,不用angular的可以正常写option即可。

协调部门 协调工作内容 操作

下面是typescript代码,把声明变量的let 换成var即可完全用于javascript

/**
     * 新增表格行
     */
    addTableRow(e: any) {
        $('.btn-add').off("click");
        $('.btn-rm').off("click");
        let button = $(e);
        let srcCode = ``;
        let srcId = '';
        button.each(function (i: any, item: any) {
            srcId = $(item).parent().parent().parent()[0].id;
            srcCode += $(item).parent().parent()[0].innerHTML;
        });
        srcCode += ``;
        $('#' + srcId).append(srcCode);
        let rmButton = $('#' + srcId).find("tr:last td:last button:last");
        let tr = $('#' + srcId).find("tr");
        if (tr.length > 1) {
            let buttonClass = "." + rmButton[0].className.replace(/ /g, ".");
            $(buttonClass).removeAttr("disabled");
            let this_ = this;
            $('.btn-add').click(function () {
                this_.addTableRow(this);
            });
            $('.btn-rm').click(function () {
                this_.removeTableRow(this);
            });
        }
    }
/**
     * 移除表格行
     */
    removeTableRow(e: any) {
        let button = $(e);
        let srcId = '';
        button.each(function (i: any, item: any) {
            srcId = $(item).parent().parent().parent()[0].id;
        });
        button.parent().parent().remove();
        let rmButton = $('#' + srcId).find("tr:last td:last button:last");
        if ($('#' + srcId).find("tr").length <= 1) {
            $(rmButton[0]).attr("disabled", "true");
        }
    }

你可能感兴趣的:(jquery动态新增/移除表格行)