如何根据表格单元格更改值设置字段值答案

【问题标题】：How to set field value based on table cell changed value如何根据表格单元格更改值设置字段值
【发布时间】：2019-01-06 12:03:13
【问题描述】：

我有两个带有标签 empID 和名称的输入字段，以及带有 3 列 tblempID、tblName 和 tblTxt 的表。当表格中每一行的任何 tblTxt 单元格值发生变化时，如何将 empID 值设置为相同的 tblmpID 值。

T 尝试了以下方法：

$(document).ready(function(){
 tblTxtchange();
  
  $('.tbl1').on('change', tblTextchange);
  
  function tblTxtchange() {
    $('.tbl1 tbody tr').each(function () {
      $(this).find('.tblTxt').each(function () {
        $('.tblTxt').change(function(){           
          $('.empID').val($('.tblText')
          .closest('tr').find($('.tblEmpID').val()));
        });
      });
    });
  }

});

table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}

<input id="empID"/>
<input id="Name"/>

<table style="width:100%" class="tbl1">
  <tr>
    <th>tblempID</th>
    <th>tblName</th> 
    <th>tblTxt</th>
  </tr>
 <tr>
    <td><input class="tblEmpID" /></td>
    <td><input class="tblName" /></td>
    <td><input class="tblTxt" /></td>
  </tr>
  <tr>
    <td><input class="tblEmpID" /></td>
    <td><input class="tblName" /></td>
    <td><input class="tblTxt" /></td>
  </tr>
  <tr>
    <td><input class="tblEmpID" /></td>
    <td><input class="tblName" /></td>
    <td><input class="tblTxt" /></td>
  </tr>
</table>

【问题讨论】：

标签： javascript jquery

【解决方案1】：

我怀疑你想多了。（您还错误地使用了.find()。）最简单的情况是，您需要一个处理.tblTxt 元素的处理程序，该处理程序找到相应的tblEmpID 值并将其设置为#empID 元素。不需要循环、函数调用等。像这样的东西：

$('.tblTxt').on('change', function () {
    let empID = $(this).closest('tr').find('.tblEmpID').val();
    $('#empID').val(empID);
});

【讨论】：

我一开始已经尝试过了，但它只适用于第一行，这就是为什么我尝试使用 .each() 循环每一行。
@M.Gooda：听起来你当时做错了什么。此工作：jsfiddle.net/2moa19Lt您无需在jQuery中循环匹配元素以将处理程序设置为它们，jQuery在选择器查找多个元素时自动执行此操作。 span>
是的，它工作，类名不正确，谢谢

【解决方案2】：

我有一个运行代码解决你的问题，如果你正在寻找其他东西，请更新

$('.tblTxt').change(function () {
  var row_emp_id = $(this).closest('tr').find('.tblEmpID').val();
  $('#empID').val(row_emp_id);
});

【讨论】：