使用jquery/javascript在表行之间粘贴数据

我试图在单击每个表行旁边的图标时动态插入表行。我在整个表后面插入了以下代码：

$(document).on('click','.paste_icon',function(){
    var origs=$('.case:checkbox:checked');
    for(var a=0; a<origs.length; a++) {
        addNewRow();
        var arr = origs.closest('tr')[a].id.split('_');
        var id = arr[arr.length-1];
        var dat = getValues(id);
        setValues(i-1, dat);
    }
    $('#check_all').add(origs).prop("checked", false);
    calculateTotal();
});

添加新行功能：

var addNewRow = function(id){
//table data here
    if( typeof id !== "undefined"){
        $('#tr_'+id).after(html);
    }else{
        $('table').append(html);
    }
    $('#caseNo_'+i).focus();
    i++;
}

---

向每行添加一个按钮，如：

<td><button class="addrow">Add row</button></td>

---

这将获取当前行的ID

addNewRow（）

将其作为可选参数，上面的代码随后将其传递给它。

我修改了Barmar发布的代码以实现此功能，完整的工作代码如下：

Javascript:

    var addNewRow = function(id){

        //Table code here
         if( typeof id !== "undefined"){
                $('#tr_'+id).after(html);
            }else{
                $('table').append(html);
            }
            $('#caseNo_'+i).focus();
            i++;
        }

        // Pastes Row On Icon Click
        $(document).on('click','.paste_icon',function(){
            var origs=$('.case:checkbox:checked');
            for(var a=0; a<origs.length; a++) {

                var paste_icon_id = $(this).attr("id");
                var paste_icon_arr = paste_icon_id.split("_");
                var icon_id = paste_icon_arr[paste_icon_arr.length-1];
                addNewRow(icon_id);
                var arr = origs.closest('tr')[a].id.split('_');
                var id = arr[arr.length-1];
                var dat = getValues(id);
                setValues(i-1, dat);
            }
            $('#check_all').add(origs).prop("checked", false);
            calculateTotal();
        });
var getValues=function(id){
        var inputs=$('#tr_'+id).find('select,input,textarea').filter('[name]');
        var values={};
        for(var i=0; i<inputs.length;i++){
            var cur=inputs[i];
            values[cur.name.match(/\[\w+]$/)||cur.name] = $(cur).is(':checkbox, :radio') ? cur.checked : cur.value;
        }
        return values;
    };
    var setValues=function(id,values){
        var inputs=$('#tr_'+id);
        for(var i in values){
            var cur=inputs.find('[name$="'+i+'"]');
            if(cur.is(':checkbox, :radio')) {
                cur.prop('checked', values[i]);
            } else {
                cur.val(values[i]);
            }
        }
    };

//to check all checkboxes
$(document).on('change','#check_all',function(){
    $('input[class=case]:checkbox').prop("checked", $(this).is(':checked'));
});

var addNewRow=函数（id）{
//表代码在这里
如果（id的类型！=“未定义”）{
$（'tr#u'+id）.after（html）；
}否则{
$（'table'）.append（html）；
}
$（'#caseNo'+i）.focus（）；
i++；
}
//单击图标粘贴行
$（文档）。在（'单击'，'上。粘贴图标'，函数（）{
var origs=$（'.case:checkbox:checked'）；
对于（var a＝0；ACN）您提供了一个更详细的HTML？@ MeloRoMiMe示例。您在HTML中没有看到任何表元素。您正在讨论一个表AIND，我在HTML中没有看到任何一个。您也没有任何检查的元素，您可以在表中间插入一行，用<代码> $（行前选择器）。.after（newrow）

新行的“内容”将被上面的my var origs代码替换，以粘贴选中表格元素的内容，对吗？您发布的代码不会创建新行，而是通过复选框进行操作。创建新行的代码位于函数

addNewRow（）中

，它调用了，但您没有显示的内容。我将发布addnewrow代码，我非常理解，复选框代码复制选中的复选框，并返回每个选中行的tr内容抱歉，还添加了更多相关代码，问题已更新

var addNewRow = function(id){
//table data here
    if( typeof id !== "undefined"){
        $('#tr_'+id).after(html);
    }else{
        $('table').append(html);
    }
    $('#caseNo_'+i).focus();
    i++;
}

<td><button class="addrow">Add row</button></td>

$(document).on("click", ".addrow", function() {
    var thisId = $(this).closest("tr").attr("id");
    addNewRow(thisId);
});

    var addNewRow = function(id){

        //Table code here
         if( typeof id !== "undefined"){
                $('#tr_'+id).after(html);
            }else{
                $('table').append(html);
            }
            $('#caseNo_'+i).focus();
            i++;
        }

        // Pastes Row On Icon Click
        $(document).on('click','.paste_icon',function(){
            var origs=$('.case:checkbox:checked');
            for(var a=0; a<origs.length; a++) {

                var paste_icon_id = $(this).attr("id");
                var paste_icon_arr = paste_icon_id.split("_");
                var icon_id = paste_icon_arr[paste_icon_arr.length-1];
                addNewRow(icon_id);
                var arr = origs.closest('tr')[a].id.split('_');
                var id = arr[arr.length-1];
                var dat = getValues(id);
                setValues(i-1, dat);
            }
            $('#check_all').add(origs).prop("checked", false);
            calculateTotal();
        });
var getValues=function(id){
        var inputs=$('#tr_'+id).find('select,input,textarea').filter('[name]');
        var values={};
        for(var i=0; i<inputs.length;i++){
            var cur=inputs[i];
            values[cur.name.match(/\[\w+]$/)||cur.name] = $(cur).is(':checkbox, :radio') ? cur.checked : cur.value;
        }
        return values;
    };
    var setValues=function(id,values){
        var inputs=$('#tr_'+id);
        for(var i in values){
            var cur=inputs.find('[name$="'+i+'"]');
            if(cur.is(':checkbox, :radio')) {
                cur.prop('checked', values[i]);
            } else {
                cur.val(values[i]);
            }
        }
    };

//to check all checkboxes
$(document).on('change','#check_all',function(){
    $('input[class=case]:checkbox').prop("checked", $(this).is(':checked'));
});

    <table><tr>
<td><input class="case" type="checkbox""/></td><td>
    <span class="paste_icon" id="paste_icon_<?php echo $key+1?>"><i class="fa fa-arrow-circle-down fa-2x"></i></span>
    </td></tr></table>