javascript - jQuery 获取最接近输入字段的值

Question

我有这样的 HTML 代码:

<tr>
  <td class='qty'><input class='narrow' value='1' /><i class='fa fa-trash' aria-hidden='true'></i></td>
  <td class='comm'><input class='narrow' value='' size='5'/></td>
</tr>

此代码将由 JS 函数自动生成，因此出现的频率更高。要从第一个输入获取值，我使用此函数:

jQuery('#tbl_order .qty input').bind('change', function() {

在此函数中，我想获取下一个输入值。我已经尝试过这个不起作用

jQuery(this).closest(".comm input").val()

Answer 1

.closest()

For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.

您可以使用find()在最近的 tr 元素上。我还更喜欢分别使用 on() 和 input 事件，而不是 bind() 和 change。

演示:

jQuery('#tbl_order .qty input').on('input', function() {
  var nextVal = jQuery(this).closest("tr").find(".comm input").val();
  console.log(nextVal);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr id="tbl_order">
    <td class='qty'><input class='narrow' value='1' /><i class='fa fa-trash' aria-hidden='true'></i></td>
    <td class='comm'><input class='narrow' value='1234' size='5'/></td>
  </tr>
</table>