JQuery克隆HTML选择并插入行和列div内的新行

我有几个HTML选择，我想克隆并插入到一个新的引导行和列中的新行中。代码段如下所示：

$（“#subBtn”）。单击（函数（）{
var ifType=$（“#pcker”）.clone（）；
var ifType2=$（“#pcker2”）.clone（）；
$（“#scontainer”）。追加（“”）；
$（“#scontainer”）.append（ifType）；
$（“#scontainer”）。追加（“”）；
$（“#scontainer”）。追加（“”）；
$（“#scontainer”）。追加（如果类型2）；
$（“#scontainer”）。追加（“”）；
})

说唱
实验
价值
选择
独自创立
说唱
实验
价值
选择
独自创立
添加按钮

您需要将

div

附加为一个整体元素（打开和关闭标记），而不是部分。追加div后，需要在所需div内追加选择框

注意：我添加了逻辑以获得克隆元素的唯一ID

见下文

var id1=0;
var id2=0;
$("#subBtn").click(function(){
    var ifType = $("#pcker").clone();
    var ifType2 = $("#pcker2").clone();
    var $row = $("<div class='row'></div>");
    $("#scontainer").append($row);
    var $col1 = $("<div class='col'></div>");
    var $col2 = $("<div class='col'></div>");
    $row.append($col1);
    $row.append($col2);

    $col1.append(ifType);
    $col2.append(ifType2);

   // change id of cloned element just to have unique ids
   $col1.attr('pcker'+id1);
   $col2.attr('pcker1'+id2);
   id1++;
   id2++;
});

varid1=0；
变量id2=0；
$（“#subBtn”）。单击（函数（）{
var ifType=$（“#pcker”）.clone（）；
var ifType2=$（“#pcker2”）.clone（）；
var$row=$（“”）；
$（“#scontainer”）。追加（$row）；
变量$col1=$（“”）；
var$col2=$（“”）；
$row.append（$col1）；
$row.append（$col2）；
$col1.append（ifType）；
$col2.追加（ifType2）；
//更改克隆元素的id以使其具有唯一id
$col1.attr（'pcker'+id1）；
$col2.attr（'pcker1'+id2）；
id1++；
id2++；
});

您需要将

div

附加为一个整体元素（打开和关闭标记），而不是部分。追加div后，需要在所需div内追加选择框

注意：我添加了逻辑以获得克隆元素的唯一ID

见下文

var id1=0;
var id2=0;
$("#subBtn").click(function(){
    var ifType = $("#pcker").clone();
    var ifType2 = $("#pcker2").clone();
    var $row = $("<div class='row'></div>");
    $("#scontainer").append($row);
    var $col1 = $("<div class='col'></div>");
    var $col2 = $("<div class='col'></div>");
    $row.append($col1);
    $row.append($col2);

    $col1.append(ifType);
    $col2.append(ifType2);

   // change id of cloned element just to have unique ids
   $col1.attr('pcker'+id1);
   $col2.attr('pcker1'+id2);
   id1++;
   id2++;
});

varid1=0；
变量id2=0；
$（“#subBtn”）。单击（函数（）{
var ifType=$（“#pcker”）.clone（）；
var ifType2=$（“#pcker2”）.clone（）；
var$row=$（“”）；
$（“#scontainer”）。追加（$row）；
变量$col1=$（“”）；
var$col2=$（“”）；
$row.append（$col1）；
$row.append（$col2）；
$col1.append（ifType）；
$col2.追加（ifType2）；
//更改克隆元素的id以使其具有唯一id
$col1.attr（'pcker'+id1）；
$col2.attr（'pcker1'+id2）；
id1++；
id2++；
});

好的，尝试以下方法：

$（“#subBtn”）。单击（函数（）{
var-ifType=$（“.pcker”）.eq（0）.clone（true）；
var ifType2=$（“.pcker2”）.eq（0）.clone（true）；
$（“#scontainer”）。追加（“”）；
$（“#scontainer”）.find（'.col'）.last（）.append（ifType）；
$（“#scontainer”）.find（'.col'）.last（）.append（ifType2）；
$（“#scontainer”）.find（'select'）.last（）.append（“”）；
})

说唱
实验
价值
选择
独自创立
说唱
实验
价值
选择
独自创立
添加按钮

好的，尝试以下方法：

$（“#subBtn”）。单击（函数（）{
var-ifType=$（“.pcker”）.eq（0）.clone（true）；
var ifType2=$（“.pcker2”）.eq（0）.clone（true）；
$（“#scontainer”）。追加（“”）；
$（“#scontainer”）.find（'.col'）.last（）.append（ifType）；
$（“#scontainer”）.find（'.col'）.last（）.append（ifType2）；
$（“#scontainer”）.find（'select'）.last（）.append（“”）；
})

说唱
实验
价值
选择
独自创立
说唱
实验
价值
选择
独自创立
添加按钮

检查后，您的克隆选择框显示在

列

div之外，这不应出现在操作面板上。检查后，您的克隆选择框显示在

列

div之外，这不应出现在操作面板上。非常感谢。您建议的行变量在多个单击实例中似乎没有保持其值。如果我需要一行selects具有相同的索引，我需要使用var index=$（“#scocontainer.row”）.length+1，这似乎很好。很高兴帮助您：）太好了。非常感谢。您建议的行变量在多个单击实例中似乎没有保持其值。如果我需要一行selects具有相同的索引，我需要使用var index=$（“#scocontainer.row”）.length+1，这似乎很好。很高兴帮助您：）