javascript - Jquery child>Parent>child>child 选择器

Question

我需要以下代码的帮助:

HTML:

<table>
 <tr class="oc">
   <td class="process">process</td>
   <td><input name="data" /></td>
 </tr>
 <tr class="oc">
   <td class="process">process</td>
   <td><input name="data" /></td>
 </tr>
</table>

在点击 td[class=process] 时，我需要 input[name=data] 的值。我尝试了几种方法但都失败了。我的尝试包括:

Jquery 内部点击函数:

var v = $(this).parent().children(":eq(2)").children().val()*1;
var v = $(this).parent().children.children("input[name=data]").val()*1;
var v = $(this).parent().find("input[name=data]").val()*1;
var v = $(this).parent().children(":eq(2)").children().val()*1;

发生的事情是，每次我点击 td[class=process]，我都会得到 input[name=data] 的先前值 + 当前值输入[名称=数据]

而且，我不知道为什么。非常感谢您的帮助。

Answer 1

您的第三个变体已经有效。

var v = $(this).parent().find("input[name=data]").val()*1;

您的第二种方法不正确，因为 children是一个函数。

您的第一种和第四种方法(除非我是盲人)是相同的。然而，由于 :eq()是零索引的； <td>你选择的实际上是位置1 , 不是 2 .你可以看到这个工作 here .

var v = $(this).parent().children(":eq(1)").children().val()*1;

---

您可能还想知道 next() ，这可能会使这更容易一些。

var v = $(this).next().children().val() * 1;

参见 next() , 和 this fiddle .