JQuery HTMLElement упаковка / распаковка

Question

Я использую jQuery вместе с плагином dataTables.dataTables предоставляет возможность открывать и закрывать строку (это означает, что дополнительная строка информации может быть открыта под обычной строкой).

С http://datatables.net/api я получил следующий хорошо работающий пример:

$(document).ready(function() {
    var oTable;

    // 'open' an information row when a row is clicked on
    $('#example tbody tr').click( function () {
        if ( oTable.fnIsOpen(this) ) {
            oTable.fnClose( this );
        } else {
            oTable.fnOpen( this, "Temporary row opened", "info_row" );
        }
    } );

    oTable = $('#example').dataTable();
} );

Теперь я хочу добавить обработчик щелчка не ко всей строке, а к элементу в строке:

$("#openCompliantsTable .icon-comment").click(…

Но, конечно, this теперь не относится к tr элемент, но для некоторого дочернего элемента.Моя попытка изменить код состояла в том, чтобы заменить this на $(this).parent().parent().get(), который не работал.

Затем я обнаружил, что на самом деле this, похоже, не то же самое, что $(this).get(), даже еслиоба являются [object HTMLElement] объектами, что меня удивило.

Любые предложения, чтобы это работало?

РЕДАКТИРОВАТЬ: моя таблица HTML выглядит следующим образом:

<table id="openCompliantsTable" class="table table-striped table-bordered table-condensed">
    <thead>
      <tr>
        <th>Reklamationsnummer</th>
        <th>Reklapositionsnummer</th>
        ...
        <th>Status</th>
        <th>Aktion</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>1</td>
        <td>1</td>
        ...
        <td>offen</td>
        <td><i class="icon-ok"></i><i class="icon-trash"></i><i class="icon-flag"></i><i class="icon-comment"></i></td>
      </tr>
      ...
    </tbody>
  </table>

Answer 1

Заменить

$(this).parent().parent().get()

на

$(this).parent().parent().get(0)

Ваша функция может быть:

$('#openCompliantsTable .icon-comment').click( function () {
    var tr = $(this).parent().parent().get(0);
    if ( oTable.fnIsOpen(tr) ) {
        oTable.fnClose(tr);
    } else {
        oTable.fnOpen(tr, "Temporary row opened", "info_row" );
    }
} );

Также см. этот пример .

Answer 2

.get () без параметров возвращает массив со всеми элементами DOM всех соответствующих элементов. Даже если у вас есть только один соответствующий элемент, вы получите массив с одним элементом.

С индексом .get () извлечет единственный элемент , который вам нужен.

Вы должны использовать:

$(this).parent().parent().get(0)

Answer 3

Или короче:

$(this).parents('tr')[0];

Это первый родитель, который является 'tr', вложение не имеет значения, и вам не нужно заботиться о том, сколько уровней вам нужно пройтиПросто будьте осторожны, если у вас есть вложенные таблицы.