Javascript jquery代码更改html不起作用

我们创建一个脚本，用于获取具有特定类的元素的

innerHTML

。这适用于第一个

。但是表1的脚本也应用于第二个和第三个

我已经尝试添加

.closest

以保持在主

中，但这不起作用。类

.myedit

的所有值都在更改。遗憾的是，

.myedit

类是动态添加的，因此我们无法创建唯一的类

我们如何改变这一点

这是你的电话号码

$（文档）.ready（函数（）{
$（“输入”）。单击（函数（）{
var sku=$（'input:checked'）。最近（'.product option'）。查找（'.option sku'）。html（）；
$（'input:checked'）.closest（'tbody'）.find（'myedit'）.html（sku）；
});
var sku=$（'input:checked'）。最近（'.product option'）。查找（'.option sku'）。html（）；
$（'input:checked'）.closest（'tbody'）.find（'myedit'）.html（sku）；
});

文本


产品选择1
SKU1
€0


产品选择2
SKU2
€0


文本


产品选择1
SKU1
€0


产品选择2
SKU2
€0


首先，您可以通过

var sku = $('input:checked').closest('.product-option').find('.option-sku').html();
    $('input:checked').closest('tbody').find('.myedit').html(sku);

jQuery将获得第一个输入：选中它将找到（因此来自第一个表的输入），然后根据第一个输入获取html。它不会选择每个输入并根据它们获取html

因此，您可以使用
each
函数根据您的每个输入选择html，并将其传递给相应的
myedit
div

第二，在输入上，您应该使用
更改
事件，而不是
单击
事件。然后通过更改输入来检查它是否变为
：已检查
，然后使用
this
关键字查找html并将其传递给
myedit
div，该div与
更改的
输入位于同一个表中

我对内容做了一点修改，使其更加清晰（仅用于示例目的）

我同意，也许有更好或更干净的方法可以做到这一点，但无论如何，请查看下面的内容


$（'input:checked'）。每个（函数（）{
让sku=$（this）.closest（'.product option'）.find（'.option sku'）.html（）；
$（this）.closest（'tbody'）.find（'.myedit'）.html（sku）；
});
$（'input'）.change（函数（）{
如果（$（this）.is（':checked'））{
让sku=$（this）.closest（'.product option'）.find（'.option sku'）.html（）；
$（this）.closest（'tbody'）.find（'.myedit'）.html（sku）；
}
});



产品选择1
内容1表1
€0


产品选择2
内容2表1
€0




产品选择1
内容1表2
€0


产品选择2
$(document).ready(function() {

  var sku = $('input:checked').closest('.product-option').find('.option-sku').html();
  $('input:checked').closest('tbody').find('.myedit').html(sku);

  $('input').click(function() {

    if ($(this).prop('checked')) {
      $(this).closest('.options-list').find('li').removeClass("active");
      $(this).closest('.product-option').addClass("active");
      var value = $(this).closest('.product-option').find('.option-sku').text();
      $(this).closest('tr').prev().find('.myedit').text(value);
    }

  });
});