Javascript 如何仅使用jquery将行传递给其他表？

我正在学习JavaScript，我希望将行从表传递到其他表，如下所示：

将行从一个表传递到另一个表，而不重复同一行。。 我该怎么办

我有这个：

$（.btn_add”）。在（“单击”，函数（）上{
var column1=$（this）.closest（'tr'）.children（）[0].textContent；
var column2=$（this）.closest（'tr'）.children（）[1].textContent；
var column4=$（this）.closest（'tr'）.children（）[3].textContent；
var column5=$（this）.closest（'tr'）.children（）[4].textContent；
$（“#第二个#表”）。追加（“+column1+”“+column2+”“+column4+”“+column5+”--Remove”）；
$（“.btn_remove”）。单击（函数（）{
$（this.parent（）.parent（）.remove（）；
});
});

#代码
产品
类别
股票
价格
行动
1.
监视A
X
5.
7.5
+加
2.
老鼠B
X
5.
12.4
+加
3.
键盘D
X
8.
22.35
+加
4.
主板C
Y
14
50
+加


#代码
产品
股票
价格
输入
计算场
行动
第二个表中的事件似乎缺少一个事件处理程序。因为内容是动态添加的，所以您需要使用

下面的代码应该可以做到这一点：

$("#second_table").on("input", "input", function() {
  var input = $(this);
  var columns = input.closest("tr").children();
  var price = columns.eq(3).text();
  var calculated = input.val() * price;
  columns.eq(5).text(calculated);
});

下面有一段正在运行的代码片段。在第二个表中更改输入时，您将看到实时计算的价格


$（.btn_add”）。在（“单击”，函数（）上{
var column1=$（this）.closest（'tr'）.children（）[0].textContent；
var column2=$（this）.closest（'tr'）.children（）[1].textContent；
var column4=$（this）.closest（'tr'）.children（）[3].textContent；
var column5=$（this）.closest（'tr'）.children（）[4].textContent；
$（“#第二个#表”）。追加（“+column1+”“+column2+”“+column4+”“+column5+”--Remove”）；
$（“.btn_remove”）。单击（函数（）{
$（this.parent（）.parent（）.remove（）；
});
});
$（“#第二个_表”）。关于（“输入”，“输入”，函数（）{
var输入=$（此）；
var columns=input.closest（“tr”）.children（）；
var price=columns.eq（3）.text（）；
计算的var=input.val（）*价格；
列。等式（5）。文本（计算）；
});

#代码
产品
类别
股票
价格
行动
1.
监视A
X
5.
7.5
+加
2.
老鼠B
X
5.
12.4
+加
3.
键盘D
X
8.
22.35
+加
4.
主板C
Y
14
50
+加


#代码
产品
股票
价格
输入
计算场
行动
第二个表中的事件似乎缺少一个事件处理程序。因为内容是动态添加的，所以您需要使用

下面的代码应该可以做到这一点：

$("#second_table").on("input", "input", function() {
  var input = $(this);
  var columns = input.closest("tr").children();
  var price = columns.eq(3).text();
  var calculated = input.val() * price;
  columns.eq(5).text(calculated);
});

下面有一段正在运行的代码片段。在第二个表中更改输入时，您将看到实时计算的价格


$（.btn_add”）。在（“单击”，函数（）上{
var column1=$（this）.closest（'tr'）.children（）[0].textContent；
var column2=$（this）.closest（'tr'）.children（）[1].textContent；
var column4=$（this）.closest（'tr'）.children（）[3].textContent；
var column5=$（this）.closest（'tr'）.children（）[4].textContent；
$（“#第二个#表”）。追加（“+column1+”“+column2+”“+column4+”“+column5+”--Remove”）；
$（“.btn_remove”）。单击（函数（）{
$（this.parent（）.parent（）.remove（）；
});
});
$（“#第二个_表”）。关于（“输入”，“输入”，函数（）{
var输入=$（此）；
var columns=input.closest（“tr”）.children（）；
var price=columns.eq（3）.text（）；
计算的var=input.val（）*价格；
列。等式（5）。文本（计算）；
});

#代码
产品
类别
股票
价格
行动
1.
监视A
X
5.
7.5
+加
2.
老鼠B
X
5.
12.4
+加
3.
键盘D
X
8.
22.35
+加
4.
主板C
Y
14
50
+加


#代码
产品
股票
价格
输入
计算场
行动
您基本上需要创建一个伪类来根据行的产品id标识行。在我的示例中，我只是将其命名为“copy_1”。然后，您可以检查第二个表中是否已经存在该ID。我还补充说，输入字段将增加为添加一个产品。如果您不想这样做，只需删除else语句

旁注：使用“on”方法，您可以声明一个全局侦听器，它也适用于动态生成的元素。您也可以将其用于“删除”按钮，而无需在每次有人添加产品时重新声明。我在我的代码中也改变了这一点。有关详细信息，请参阅此帖子：


$（.btn_add”）。在（“单击”，函数（）上{
var column1=$（this）.closest（'tr'）.children（）[0].textContent；
var column2=$（this）.closest（'tr'）.children（）[1].textContent；
var column4=$（this）.closest（'tr'）.children（）[3].textContent；
var column5=$（this）.closest（'tr'）.children（）[4].textContent；
//检查第二个表中是否已存在该行
//如果否，则将该行添加到第二个表中
//如果是，请在输入字段中添加一个产品
if（$（“#第二个#表.copy#”+column1.length==0）
{
$（“#第二个#表”）。追加（“+column1+”“+column2+”“+column4+”“+column5+”--Remove”）；
}
其他的
{
var valu