Пройдите несколько уровней вверх по иерархии DOM к строке содержащей таблицы

Question

Пройдите несколько уровней вверх по иерархии DOM к строке содержащей таблицы

0

У меня есть структура HTML, например:

<tr class = "@rowOrdinal" id = "...">                            
    <td>
        <a href = "#">
            <img src = "/Content/updateIcon.gif" class = "updateResourceImageButton" id = "..." />
        </a>
        &nbsp;

        <a href = "#">
            <img src = "/Content/cancelIcon.gif" class = "cancelImageButton" />
        </a>
        &nbsp;
    </td>

    <td class = "hiddenColumn" id = ...>...</td>
    <td class = "resourceKeyColumn" id = ...>...</td>
    ... and so on...

Когда щелкнули ссылку обновления, я хотел бы получить ссылку на строку, т. tr Элемент tr в котором была гиперссылка обновления.

Итак, в нижеприведенном слушателе событий я хотел бы подняться на иерархию DOM на несколько уровней. Я мог бы использовать простой JavaScript и использовать while цикл, чтобы получить parentNode, но как бы я сделать это с помощью JQuery?

function WireHandlers() {
    $('.updateResourceImageButton').click(UpdateResourceLinkClickedHandler);
}

function UpdateResourceLinkClickedHandler() {
  // how do I get a reference to the tr that contains
  // the hyperlink which is the source of this event?
}

$(document).ready(function () { WireHandlers(); });

Water Cooler v2 09 окт. 2013, в 15:42

Источник

Теги:

javascript

jquery

2 ответа

1

function WireHandlers() {
    $('.updateResourceImageButton').click( function(){

        var trParent = $( this ).parent().parent();
        UpdateResourceLinkClickedHandler();
    });
}

Не знаете, почему вам нужна ссылка на родительский tr, поэтому не использовал ее в моем примере

gurvinder372 09 окт. 2013, в 10:01

0

Вы также можете сделать var trParent = $ (this) .parent ("tr");
gurvinder372 09 окт. 2013, в 12:55
0

Большое спасибо, Гурвиндер. Это так просто. Я люблю JQuery. :-)
Water Cooler v2 09 окт. 2013, в 12:59

Ещё вопросы

Вы также можете сделать var trParent = $ (this) .parent ("tr");
Большое спасибо, Гурвиндер. Это так просто. Я люблю JQuery. :-)

undefined · Accepted Answer · 2013-10-09T10-09-00.000Z

Вы ищете метод .closest():

function UpdateResourceLinkClickedHandler() {
    var $tr = $(this).closest('tr');
}

Король вау! JQuery великолепен! Это именно то , что я искал. Большое спасибо. :-)
@ WaterCoolerv2, примите ответ, если он у вас работает :)