Jquery Selector - Как выбрать следующий столбец textarea

Question

Хорошо,

Вот экзамен:

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

Мне нужно изменить значение текстовой области, когда я нажимаю на кнопку. Значение будет получено из заданной переменной. Этот код не имеет других идентификаторов или классов, на которые можно ссылаться. Итак, у меня есть следующее

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/closest
• .find(): http://api.jquery.com/find
• .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

Есть много способов достичь того же.Ниже приводится один

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

Answer 4

Попробуйте использовать что-то вроде этого:

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