表行记录单击检索

Question

如何通过使用j查询单击1行来检索输入框中的第一列？我已经有一种css风格来悬停表格行。

<script>
    $(document).ready(function(){
        $("#record tr").click(data);
    });
</script>

<table id="record">
    <tr>
        <TD>1</TD>
        <td>apple</td>
    </tr>
    <tr>
        <TD>2</TD>
        <TD>banana</TD>
    </tr>
    <tr>
        <TD>3</TD>
        <TD>orange</TD>
    </tr>
</table>

 <input type="text" name="input_1">
   

Answer 1

使用带回调的 text() 获取文字内容，您可以将索引和值作为参数获取。现在，使用 eq() 的索引获取输入元素将有所帮助，最后使用 val() 更新值。

＆＃13;

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
  $(document).ready(function() {
    $("#record tr").click(function() {
      $('td', this).text(function(i, v) {
        $("#insert_here input").eq(i).val(v);
      });
    });
  });
</script>
<table id="record">
  <tr>
    <TD>apple</TD>
    <td>apple</td>
  </tr>
  <tr>
    <TD>banana</TD>
    <TD>banana</TD>
  </tr>
  <tr>
    <TD>orange</TD>
    <TD>orange</TD>
  </tr>
</table>




<div id="insert_here">
  <input type="text" name="input 1">
  <input type="text" name="input 2">
</div>

＆＃13;

＆＃13;

＆＃13;

或者使用 val() 并使用回调

也可以这样做

＆＃13;

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
  $(document).ready(function() {
    $("#record tr").click(function() {
      var $td = $('td', this);
      $("#insert_here input").val(function(i) {
        return $td.eq(i).text();
      });
    });
  });
</script>
<table id="record">
  <tr>
    <TD>apple</TD>
    <td>apple</td>
  </tr>
  <tr>
    <TD>banana</TD>
    <TD>banana</TD>
  </tr>
  <tr>
    <TD>orange</TD>
    <TD>orange</TD>
  </tr>
</table>




<div id="insert_here">
  <input type="text" name="input 1">
  <input type="text" name="input 2">
</div>

＆＃13;

＆＃13;

＆＃13;