Jquery 选择器 - 如何选择下一列文本区域

Question

好的，

这是示例：

<table>
    <tr>
        <td>
            <type="button" id="mybutton" value="insert">
        </td>
        <td>
            <textarea>My Text</textarea>
        </td>
    </tr>
</table>

当我单击按钮时，我需要更改文本区域值。该值将来自设置变量。此代码没有其他 ID 或类可供引用。所以我有以下内容

jQuery('#mybutton').click(function(){

  jQuery(this).parent().next()...????;

});

这将使我进入下一栏，但我不知道如何从那里选择 textarea 。

我尝试了 child() 和另一个 next() 但没有成功。

Answer 1

要在 jQuery 中选择子元素，我们使用 .children()：

jQuery('#mybutton').click(function(){
    jQuery(this).parent().next().children().val(some_variable);
});

请注意，这也会选择 textarea 的所有同级元素，除非您添加 textarea > 作为 .children() 函数调用中的选择器： .children('textarea')

您还可以使用 .closest() 和.find()：

jQuery('#mybutton').click(function(){
    jQuery(this).closest('tr').find('textarea').val(some_variable);
});

.closest() 查找与选择器匹配的第一个祖先元素，然后查找，很好地在根选择的后代元素中找到选择器。

给你的一些文档：

• .closest(): http://api.jquery.com/最接近
• .find()：http://api.jquery.com/查找
• .children(): http://api.jquery.com/children
• jQuery 选择器： http://api.jquery.com/category/selectors/ （我推荐检查一下，因为它有一些非常有用的东西选择器）

Answer 2

如果此表将来可能会发生变化，您不希望如此含糊。这是您想要的更具体的内容：

$(this).closest('table').find('textarea').val('your val');

更多信息：

.closest ()
.find()

Answer 3

尝试使用这样的东西：

jQuery(this).parent().next().find('textarea').val('CHANGE VALUE');;

Answer 4

有很多方法可以实现同样的目标。以下为一

$(this).parent().siblings().find('textarea').val("New Text");