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

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>

Answer 2

您可以将名称用作数组并为输入字段创建通用类名...

希望它工作...

 $('.myclassname').on("keyup",function(){

        var row_index = $(this).closest("tr").index();

        // row_index = row_index-1; // if you have tr header then enable this also...

        var textvalue = $("[name='position[]']").eq(row_index).val();

        alert(textvalue);

    });

<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[]" class="myclassname" style="text-align: center;" maxlength="3" size="3" value="NA" /></td>

      <td></td>

    </tr>

    <tr>

      <td><input type="checkbox" name="visible" id="soil_row_cb" checked></td>

      <td><input type="text" name="position[]" class="myclassname" style="text-align: center;" maxlength="3" size="3" value="s" /></td>

      <td>Name</td>

    </tr>

  </tbody>

</table>