javascript - 模式中多个文本框的更改事件

Question

我有一个表格，表格的每一行都有一个复选框、文本框和名称字段。下面是html

<tr>
  <td><input type="checkbox" name="visible" id="soil_row_cb" checked></td>
  <td><input type="text" name="position" style="text-align: center;" maxlength="3" size="3" value="NA"></td>
  <td>Name</td>
  <td><input type="text" name="factor" style="text-align: center;" maxlength="3" size="3" value="NA"></td>
</tr>

我想在名称 = 位置 的任何文本框中输入该值后立即读取该值

Answer 1

请看一下

$("input[name='position']").keyup(function() {

  var valueOfInput = $(this).val(); //value
  var indexOfTr = $(this).parents('tr').index(); //index

  console.log(valueOfInput, '-->', indexOfTr);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="mytable">
  <tbody>
    <tr>
      <td><input type="checkbox" name="visible" id="soil_row_cb" checked></td>
      <td><input type="text" name="position" style="text-align: center;" maxlength="3" size="3" value="NA" /></td>
      <td><input type="text" name="position" style="text-align: center;" maxlength="3" size="3" value="w" /></td>
    </tr>
    <tr>
      <td><input type="checkbox" name="visible" id="soil_row_cb" checked></td>
      <td><input type="text" name="position" style="text-align: center;" maxlength="3" size="3" value="s" /></td>
      <td>Name</td>
    </tr>
  </tbody>
</table>