JQuery parent-> child selection

Question

У меня есть группа текстовых полей, над которыми я хочу выполнить некоторые действия на стороне клиента.Я хочу использовать JQuery для этого.Я упростил пример моей проблемы следующим образом:

<asp:TextBox ID="Don'tSelectME_1" runat="server" />
 <table id = "outer_1">
  <table id="inner_1">
   <tr>
    <td>
     <asp:TextBox ID="SelectME_1" runat="server" />
    </td>
    <td>
     <asp:TextBox ID="SelectME_2" runat="server" />
    </td>
   </tr>
  </table>
  <table id="inner_2">
   <tr>
    <td>
     <asp:TextBox ID="SelectME_3" runat="server" />
    </td>
    <td>
     <asp:TextBox ID="SelectME_4" runat="server" />
    </td>
   </tr>
 </table>
</table>

Без обсуждения вложенных таблиц (я бы предпочел скорее использовать div), я хочу выбрать текстовые поля внутри 2 вложенных таблиц.

Я пытаюсь выбрать, используя что-то вроде $ ('table [id = "external_1"]> table> tr> td> input), чтобы получить все входные данные текстового поля.Не работает, однако, у кого-нибудь есть идеи?Я думаю, что, возможно, селектор ">" может быть использован только один раз в селекторе.Спасибо всем заранее

Answer 1

Мне всегда интересно, почему люди используют .find(), когда его можно просто вставить непосредственно в селектор и позволить механизму селектора решить, как обрабатывать его в одном вызове функции вместо двух.

$("#outer_1 input")

получит все входные теги в указанной таблице. Объяснить это значит найти объект с идентификатором #outer_1, а затем найти всех потомков с типом тега input.

.

Answer 2

$('table#outer_1').find('input');

Здесь - это живой рабочий пример , я также исправил неверную таблицу html ...

Answer 3

Answer 4

Попробуйте, это гораздо более гибкий

$("table").find("input")

или только для дочерних таблиц

$("table table").find("input")

Answer 5

Это не работает, потому что

• (почти) все браузеры вставляют тег tbody:

  $('#outer_1 > tbody table > tbody > tr > td >input')

• Ваша HTML-разметка для таблицы неверна.

См. Эту рабочую скрипку: http://jsfiddle.net/mrchief/6vQ9p/

Однако вы можете упростить выбор, сказав:

$('#outer_1 #inner_1 :input') (если вы должны использовать внешнюю таблицу)

или $('#inner_1 :input') (так как у вас есть идентификатор и для внутреннего стола)

http://jsfiddle.net/mrchief/6vQ9p/1/